无法使用 Angular2 主题在组件之间进行通信

Question

我正在尝试使用主题在两个组件之间进行通信

private onAdd = new Subject<any>();
onAdd$ = this.onAdd.asObservable();

this.onAdd.next(event);

这些是我写的服务：

我在 ngOninit 中的其他组件中像这样听它们

this.service.onAdd$.subscribe((alert) => {
            console.log('Component---  ' + alert);
         });

两件事：

1. this.onAdd.next(事件); ---> 未定义
2. console.log('组件---' + 警报); ----> 没有打印出来

所以，我可以确保我的事件没有被传达给其他组件，我无法弄清楚问题出在哪里。谁能帮帮我。

Answer 1

尝试像这样重构您的服务。 myService.service.ts

class MyService {
 private onAdd = new Subject<any>();

   sendonAdd(value) {
     this.onAdd.next(value);
   }
   getonAdd(){
    return this.onAdd.asObservable();
   }
}

现在将此服务注入到您想要通过调用 sendonAdd() 设置 onadd 值的组件中。在另一个组件中调用 getonAdd() 并订阅它。希望这可以帮助！如果是，请接受我的回答。

Answer 2

除非您使用的是“ReplaySubject”或“BehaviorSubject”，否则如果在组件订阅主题之前调用了“next”方法，则在再次调用下一个方法之前它不会接收任何数据。

编辑 - 试试这个简单的工作 plunkr 示例 - http://plnkr.co/edit/34Zj0QB5chEYj7g1vRmN

在 plunkr 中，您可以看到，如果您在订阅前多次递增该值，当您使用 ReplaySubject 点击订阅按钮时，您的组件将自动接收最后一个值。使用普通主题，订阅时，在您再次点击“递增”按钮之前，不会显示该值。

如果你打电话

 this.onAdd.next(event);

在组件订阅它之后，它应该再次接收数据。

或尝试更改为重播主题，这样主题将在收到新订阅者时发送最后发出的值

 private onAdd = new ReplaySubject<any>();

只要确保你导入它

 import { ReplaySubject } from 'rxjs/ReplaySubject';