0

我是 rxjs 的新手，所以我想问一个关于Angular 2,Observables和BehaviorSubject/Subject.

所以，我想要实现的是：onclick一个button里面的一个ComponentA来通知其他组件，例如ComponentB，ComponentC.

到目前为止我所做的是创建一个service：

private isMenuOpenBS = new BehaviorSubject(false);

  toggleMenu(): void {
    this.isMenuOpenBS.next(!this.isMenuOpenBS.getValue());
  }

  getMenuState(): Observable<boolean> {
    return this.isMenuOpenBS.asObservable();
  }

然后有一个组件provide menuService调用this.menuService.toggleMenu()改变 的值BehaviorSubject。代码 ：

toggleMenu(): void {
    this.menuService.toggleMenu();
    this.menuService.isMenuOpenBS.subscribe(
      (data) => {
        console.log(data)
      },
      (e) => {console.log(e)},
      () => {console.log('completed')}
    )
  }

还有另一个组件，OnInit() subscribes它getMenuState()是一个Observable，但它的值只在OnInit(). 代码：

ngOnInit(): void {
    this.menuService.getMenuState().subscribe(
      (data)=>{
        this.messages = data;
        console.log('nav component');
      },
      (e) => {console.log(e)},
      () => {console.log('completed')}
    )
  }

该complete函数永远不会被调用。

有什么想法我做错了什么，或者我在逻辑上遗漏了什么？

--

编辑：所以，为了解释更多问题是我可以看到可观察对象具有 oninit 的第一个值，但没有别的。之后没有错误没有完成，或者没有“下一个”值，这是错误的，因为我从主题发送了新值。最后，问题出在组件的提供者列表上，而不是 observables 或主题的问题，但在解决问题之前，不容易看出问题就在那里。

4

3 回答 3

0

一些东西...

  1. 您不需要将您的 BehaviorSubject 作为可观察对象返回，您应该能够订阅可观察对象没有问题。
  2. 每次调用切换功能时，您不应该继续订阅服务。通过这样做，您将创建大量订阅。如果您从上面接受了我的建议，您可以只记录 getValue() 函数的返回。

很高兴你解决了它！

于 2017-06-06T01:38:06.010 回答
0

您可以通过子父关系或通过服务在组件之间进行通信。

https://angular.io/docs/ts/latest/cookbook/component-communication.html

但是有一种方法可以通过ngrx/store。这个概念类似于 Redux。你可以试试。

于 2017-05-30T19:18:34.250 回答
0

我粘贴的代码没有任何问题。我的问题是components我创建的 2 在他们的providers数组中注入了“MenuService”，所以我没有单例。

我providers从两个组件的阵列中删除了服务，它工作了！

PS：这个http://jasonwatmore.com/post/2016/12/01/angular-2-communicating-between-components-with-observable-subject是一个有用的教程，可以解决我在providers数组中遇到的问题。

于 2017-05-30T19:19:14.543 回答