角2 - BehaviorSubjectでループを作成するサービス

Question

クリック可能なチャートを含むネストされたコンポーネントがあり、選択可能なセクションが3つあり、その中にあるmd-tab-groupのselectedIndexが設定されます。最初のタブに移動し、2番目のタブは2番目のタブに、3番目のタブは3番目のタブに移動します。

問題は、私が使用しているサービスが何らかのループを作成しているようです。私がサービスを取っているステップをコンソール化すると、毎回大きくなっています。

Before: 
0 
1 
After 
1 
Before: 
1 
2 
2 
2 
After: 
2 
Before: 
2 
3 
3 
3 
3 
3 
3 
After 
3 

：

関連サービスコード：私はさらに2回、最初のセクションをクリックしてメインナビゲーションとバックチャートに移動して、プロセスを繰り返したときに私が見る何

changeActiveTab(number) { 
    console.log("Before: "); 
    this._activeTab.subscribe(val => console.log(val)); 
    this._activeTab.next(number); 
    console.log("After"); 
    this._activeTab.subscribe(val => console.log(val)); 
    } 

私はBehaviorSubject'sにかなり新しいです、どこに間違っているのだろうか？

（つまり、いずれかの場合に役立ちます私が使用私の例では、hereからだった）

親コンポーネントのための

関連するコード：子コンポーネントの

selectedTab: number; 
    subscription:Subscription; 
    constructor(private _activeTabService: ActiveTabService) { } 

    ngOnInit() { 
    this.subscription = this._activeTabService.activeTab$.subscribe(
     selectedTab => this.selectedTab = selectedTab); 
    } 

    ngOnDestroy(){ 
    this.subscription.unsubscribe(); 
    } 

関連チャートTS：

onClick(event){ 
    if(event.series == 'Table'){ 
     this.changeActiveTab(1); 
    } 
    if(event.series == 'Chairs'){ 
     this.changeActiveTab(2); 
    }   
    if(event.series == 'Desks'){ 
     this.changeActiveTab(3); 
    } 
    } 

Answer 1

あなたが正しいです。 changeActiveTabはすべての呼び出しでより多くのサブスクリプションを作成します。 サービスはサブスクリプションを作成すべきではありません。 サービスには2つの方法が必要です。 1. setTab - 関連するパラメータでsubject.nextを呼び出します。 2 register - そのサブジェクトのオブザーバブルを返します。

exmaple：私のコンポーネントで

export class tabService { 
subject = new Subject(); 
setTab(value: string) 
    this.subject.next(value); 
} 

registerTab(){ 
return this.subject.asObservable(); 
} 

：

myfunction(){ 
    this.tabService.registerTab().subscribe(
    (res) => do what you want with this value.... 
); 

changeTab(value: string) 
{ 
    this.tabService.setTab(value); 
}