Question

我正在使用Rxjs和Angular7。我有一个父组件和一个子组件。我有一种方法可以在子组件上调用Subject：

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

我正在使用ngOnInit从ViewChild的父组件中调用它：

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

但是，如果我从父组件中的subscribe调用this.subject$的{{1}}，则永远不会触发它。如果我使用父级或子级中的一个按钮调用该方法，则ngOnInit会正常触发。我在做什么错了？

请参阅StackBlitz演示here。

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);

关注该问题以了解主题和行为主题之间的区别