订阅另一个组件中的服务变量?

时间:2020-03-06 20:04:33

标签: angular

我正在尝试侦听我创建的服务中变量的更改,但是我似乎无法使其正常工作,也许我做错了什么?

这是我尝试收听的组件:

 ngOnInit() {
    this.isOpen.open.subscribe(value => {
      console.log('hello');
    })
  }

这是我要从中发送它的另一个组件

  onClick(value){
    if (value === 'open') {
      this.isOpen.isOpen(true);
    } else {
      this.isOpen.isOpen(false);
    }
  }

这是我的服务

  public open: Subject<boolean> = new Subject<boolean>()

constructor() { }

isOpen(value) {
    if (value === true) {
        this.open.next(true)
    } else {
        this.open.next(false)
    }
}

由于某种原因,它不会控制台注销,我知道我的onClick函数可以访问该服务,因为我可以注销其中的值,但是它不想获取我的其他组件。关于我在做什么错的任何想法吗?

1 个答案:

答案 0 :(得分:0)

您应该听观察性内容而不是主题内容

为您服务

// create subject
private open: Subject <boolean> = new Subject<boolean>()
// create an observable from the subject
public open$: Observable <boolean> = this.open.asObservable();

在您的组件中

private sub: Subscription; 

ngOnInit() {
    this.sub = this.isOpen.open$
        .subscribe(value => {
            console.log('hello');
        });
}

ngOnDestroy() {
    // remove subscription from memory  otherwise you'll have memory leaks
    this.sub.unsubscribe()
}

其余的可以保持不变