2017-04-06 5 views
0

私はアプリケーション内の単一の状態を管理するための簡単なサービス、つまりローダの可視性を試しています。シンプルな状態のサービスが不要な複雑さ

一部のコンポーネントによって変更が発行され、メインレイアウトコンポーネントはそれをサブスクライブしてブール変更を監視します。その後、単純なngIfによって処理されます。ここで

はコードです:

import { Injectable } from '@angular/core'; 
import { Observable } from 'rxjs/Rx'; 
import { Subject } from 'rxjs/Subject'; 

@Injectable() 
export class AppLoaderService { 
    private isLoaderVisible = new Subject<boolean>(); 

    changeLoaderState = this.isLoaderVisible.asObservable(); 

    emitChange(state: any) { 
    this.isLoaderVisible.next(state); 
    } 

} 

は、単純なトグラーのためにあまりにも多くの複雑さを導入し、この単純なサービスを作成するための私の方法ですか?

私のケースではSubjectまたはBehaviorSubjectを使用していますか?サービスのinit(BehaviorSubject)でこのような変更を発行するか、デフォルト値を設定したいときに、それらを使用する必要性に関する情報がありました。

しかし、おそらく単純なObservableでも十分でしょうが、値の変更をどのように処理するのですか?

答えて

1

あなたが提供している唯一のものが*ngIfの場合は、SubjectObservableは使用しません。単純なbooleanの値をサービスのプロパティとして使用できます。たぶんゲッターとセッターですが、可視性の変化に反応しなければならない依存関係がなければ、Observablesと複雑にはならないでしょう。

+0

は私のレイアウトコンポーネントは、このブール値を使用して、この単純なを変更検出することができますあなたのcomponent.ts

export class AppComponent { constructor( private loaderService: AppLoaderService ){} ... 

にそしてあなたのcomponent.htmlにしましょうブール値?変更検出をトリガーするために(観測可能な)任意の値をサブスクライブする必要はありませんか? – BlackHoleGalaxy

+0

はい、その変数を変更すると、いわゆる 'zone'で作業する可能性が高くなります。これは角度の美しさです。変数を変更するだけで、テンプレートが即座に反応します。これはもちろん、デフォルトの 'ChangeDetectionStrategy'を使用する場合です – PierreDuc

1

ローダーを表示するだけであれば、ブール値を直接使用することができます。これははるかに簡単です。

public isLoaderVisible:boolean=false; 

のは

<div *ngIf="loaderService.isLoaderVisible"> 
    <!-- do something here --> 
関連する問題