從ngOnInit的父組件調用時主題未觸發

Question

我正在使用Rxjs和Angular7。我有一個父組件和一個子組件。 我有一種方法可以在子組件上調用Subject ：

updateSubject(text: string) {
  this.subject$.next(text);
}

我使用ViewChild從ngOnInit父組件中ngOnInit ViewChild ：

ngOnInit() {
  this.childComponent.updateSubject('New Text');
}

但是，如果我從父組件中的ngOnInit調用，則永遠不會觸發對this.subject$的subscribe 。 如果我使用父級或子級中的一個按鈕調用該方法，則subscribe會觸發。 我究竟做錯了什么？

在此處查看StackBlitz演示。

Answer 1

父級初始化后 ，將調用子級中的subscribe() 。 Angular按照與DOM相同的順序初始化組件，因此先初始化父組件，然后再初始化子組件。

如果未訂閱任何內容，則Subject()會丟棄發射的值，並且由於子級訂閱較晚，因此不會接收該值。

您可以使用BehaviorSubject（）或ReplaySubject（）取決於您是否需要初始值。

Answer 2

您需要使用AfterViewInit生命周期掛鈎。 調用OnInit時尚未渲染您的子組件。

所以這將工作：

ngAfterViewInit() {
 this.childComponent.updateSubject('View initialized');
}

Answer 3

使用BehaviorSubject代替Subject

subject$: BehaviorSubject<string> = new BehaviorSubject<string>(null);

遵循此問題以了解主題和行為主題之間的區別

主體與行為主體之間的差異