2016-09-23 8 views
1

Angular2のObservableで 'subscribe'と 'unsubscribe'はどのように動作しますか? CRUD操作を含み、CRUDと対話サービスとの間で、 観測Angular2はObservablesを使用する正しい方法ですか?

  • を返し

    1. CRUD(レポ)サービス:

      私のアーキテクチャは、次の通りです。このサービスはコンポーネントに注入され、専用のBehaviorSubjectsを含みます。私は以前のようなゲッター言及に加入することによって、データにアクセスし、コンポーネントレベルでは、このような

      get selectedClient(): Observable<Client> { 
          return this._selectedClient.asObservable(); 
      } 
      
      get clients(): Observable<Client[]> { 
          return this._clients.asObservable(); 
      } 
      
    2. として基礎となる値を公開:私はお願いしたいと思います

      deleteClient() { 
      this.selectedClient.subscribe(actualClient => { 
          this.clientStore.deleteClient(actualClient).subscribe(response => { 
           if (response) { 
            this.router.navigate(['/clients']); 
           } 
          }); 
      }).unsubscribe(); 
      } 
      
      updateClient() { 
          this.clientUpdateForm.submitClientForm().subscribe(client => { 
           if (client) { 
            this.growlService.showInfoMessage("Client updated", client.firstName + " " + client.lastName); 
           } 
          }).unsubscribe(); 
      } 
      
      this.selectedClient.subscribe(client => { 
          this.clientForm = this.clientUpdateForm.clientForm; 
      }).unsubscribe(); 
      

    まず、ありますこのデザインに何か問題がありますか? 第2に、いつ退会する必要がありますか?

    考えられるのは、selectedClientがアプリケーションの状態オブジェクトであるということです。

    しかし、それはすべてのコンポーネントでこの「購読/購読中止」のすべてをもたらし、あなたが購読を停止しないと私の理解から、サブスクリプション配列に別の購読を追加します。定期購読

    「selectedItem」という概念がアプリにはありますか?

  • 答えて

    1

    あなたのデザインはかなり安定しています。 ngrx/storeと考えると、Observables/BehaviorSubjectsも使用しますが、さらにReduxパターンを実装することで、コード全体の可読性とデザインが向上します。

    通常、Observablesからの登録を解除する必要はありません。 HTTP観測値は、値を返した後に単独で完了します(またはエラーが発生しました)。

    観測者は、完了していないときに登録を解除する必要があります(例:Observable.timer)。routerServiceからパラメータを取得する場合

    +0

    ありがとうございます。私は今いつ退会するのか理解しています。私は前にngrx/storeを試してみましたが、ほぼ同じようなパターンをしているようですが、ちょっと混乱したAPIを公開しました。 – ZeroCool

    +0

    あなたはreduxパターンについて詳しく読むことをお勧めします。ダン・アブラモフにはegghead.ioに関する良いチュートリアルがあります。次に、ngrx/example-appをチェックアウトすることができます –

    関連する問題