如何避免一個可觀察的多個用戶？

Question

我有一個ModalControllerService，它具有一個可觀察到的從Modal返回值的值。 當我只有一個組件在一個頁面中打開一個模式時，此功能很好，但是當我在同一頁面中有多個組件時，所有訂閱者都在同一時間進行訂閱。

我為避免這種情況要做的事情，是否有一種方法可以區分訂戶的每個訂閱？

@Injectable()
export class ModalControllerService {
  private modalStack: ModalStackObject[] = [];
  private afterDismissObservable = new Subject<any>();
  onAfterDismiss$ = this.afterDismissObservable.asObservable();

  public get lastModal() {
    return this.modalStack[this.modalStack.length - 1];
  }

  close(model?: any) {
    if (this.modalStack && this.modalStack.length > 0) {
      this.lastModal.component.dismiss()
        .then(() => {
          this.afterDismissObservable.next(model);
          this.modalStack.pop();
        });
    }
  }
}

@Component({
  ...
});
export class SomeComponent {
  private modalSubscription: Subscription;
  value: any;

  constructor(modalCtrl: ModalControllerService){
    this.modalSubscription = this.modalCtrl.onAfterDismiss$.subscribe(result => {
      this.value = result;
    });
  }

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

Answer 1

我相信這是因為您的組件正在同時初始化。 組件初始化時，默認情況下將運行構造函數。 所以這對您可能是個問題。 我不能對此說太多，但是您可以做的是可以將onAfterDismiss $ .subscribe（）包裝在任何自定義函數中

例如。 單擊按鈕的功能。

組件1

constructor(modalCtrl: ModalControllerService){
        this.modalSubscription = this.modalCtrl.onAfterDismiss$.subscribe(result => {
             this.value = result;
        });
}

組件2

constructor(modalCtrl: ModalControllerService){}

click(){                         // it will subscribe to the observable when button is clicked.
        this.modalSubscription = this.modalCtrl.onAfterDismiss$.subscribe(result => {
             this.value = result;
        });
    }
}