web-dev-qa-db-ja.com

Angular再サブスクライブ中のObjectUnsubscribedError

NgOnDestroyが呼び出されてunsubscribeが呼び出された後、2回目にEventEmitterにサブスクライブしようとすると、次のエラーが発生します。

    ngOnInit() {
        this.route.params.subscribe(params => {
         this.resources.eco_id= params['id']
        });
        this.http.ReloadForm.subscribe(res=>this.OnFormLoad(res));
      }

  ngOnDestroy(){
    this.http.ReloadForm.unsubscribe();
  }

core.js:1601エラーエラー:EventEmitter.Push ../ node_modules/rxjs/_esm5/internal/Subject.js.Subject._trySubscribe(Subject.js:86)の新しいObjectUnsubscribedError(ObjectUnsubscribedError.js:6)でオブジェクトのサブスクライブが解除されましたEventEmitter.Push ../ node_modules/rxjs/_esm5/internal/Observable.js.Observable.subscribe(Observable.js:28)at EventEmitter.Push ../ node_modules/@ angular/core/fesm5 /core.js.EventEmitter。 EcoProcedureFormComponent.Push ../ src/app/forms/eco-form/eco-procedure-form.component.ts.EcoProcedureFormComponent.ngOnInit(eco-procedure-form.component.ts:57)でサブスクライブ(core.js:3743) )at checkAndUpdateDirectiveInline(core.js:10105)at checkAndUpdateNodeInline(core.js:11371)at checkAndUpdateNode(core.js:11333)at prodCheckAndUpdateNode(core.js:11877)at Object.eval [as updateDirectives](EcoProcedureFormComponent_Host.ngfactory。 js:10)

ngOnDestroyでサブスクリプションを解除しなくても、すべてが正常に機能しますが、何らかの方法でサブスクリプションをリリースする必要があります。

どうすれば解決できますか?

ありがとうございました

8
Or Yaacov

サブスクリプション変数を追加し、それにサブスクリプションを割り当てる必要があります。次に、ngOnDestroyで、その変数のサブスクライブを解除してサブスクリプションを解放します。
そんな感じ:

routesSubscription: Subscription;
serviceSubscription: Subscription;

ngOnInit() {
    this.routesSubscription= this.route.params.subscribe(params => {
     this.resources.eco_id= params['id']
    });
    this.serviceSubscription= this.http.ReloadForm.subscribe(res=>this.OnFormLoad(res));
  }

ngOnDestroy(){
    if(this.routesSubscription){
      this.routesSubscription.unsubscribe();
    }
    if(this.serviceSubscription){
      this.serviceSubscription.unsubscribe();
    }
}

一緒に購読を解除したい場合は、.add()を使用して「子」を購読に追加してから、一緒に購読を解除できます。より動的な制御が必要な場合は、それぞれに変数を追加するだけで(グループに分割することもできます)、より詳細に制御できます。

-更新-
他のソリューションの例:

例1:

subscriptions = new Subscription();

someFunc = () => {
    this.subscriptions.add(
        something.subscribe();
    );
}

ngOnDestroy(){
    if(this.subscriptions){
        this.subscriptions.unsubscribe();
    }
}



例2:

subscriptionGroup: Subscription[]= [];

someFunc = () => {
    this.subscriptionGroup.Push(something.subscribe())
}

someOtherFunc = () => {
    this.subscriptionGroup.Push(somethingElse.subscribe())
}

ngOnDestroy(){
    this.subscriptionGroup.forEach(subscription => {
        subscription.unsubscribe()
    }
}
9
dAxx_