分享
三行代码  ›  专栏  ›  技术社区  ›  Smokey Dawson

行为对象不工作角度5

  •  4
  • Smokey Dawson  · 技术社区  · 1 年前

    我好像搞不懂问题是什么,

    我有一个服务,有一个行为主题,像这样…

    popupSource = new BehaviorSubject<any>('');
    
    popup(component) {
       this.popupSource.next(component);
    }
    

    然后在我的标题组件中

    popupClick() {
        this._service.popup('example');    
    }
    

    然后在my header.html中

    <button (click)="popupClick()"></button>
    

    然后在我的应用程序组件中

    ngOnInit() {
        this._service.popupSource.subscribe((result) => {
           console.log(result);
        })
    }
    

    所以现在发生的是咔嚓声 this._service.popup('example'); 但它从来没有达到订阅…

    我在每个函数上设置了断点,它成功地到达了 this.popupSource.next(component) 但是什么都没有??每次我点击按钮,我都会得到控制台日志。

    我不知道我做错了什么…为了简洁起见,我漏掉了代码,如果你需要更多信息,请告诉我

    编辑

    我也试过了

    private popupSource = new BehaviorSubject<any>('');
    
    getPopup = this.popupSource.asObservable();
    
    popup(component) {
       this.popupSource.next(component);
    }
    

    而我的应用程序中的组件将侦听到getpopup

    ngOnInit() {
        this._service.getPopup.subscribe((result) => {
           console.log(result);
        })
    }
    

    那也不管用,我不知道问题是什么…

    谢谢

    2 回复  |  直到 1 年前
        1
  •  7
  •   PhatBuck GeoAstronaute    5 月前

    这里的问题是,您在两个不同的模块中提供服务,最后得到两个服务实例。如果使用AngularV6,最简单的方法是使用 提供在 服务中的标志:

    import { Injectable } from '@angular/core';
    
    @Injectable({providedIn: 'root'})
    class myService {}
    

    通过这种方式,您不需要在任何模块的providers数组中提供服务,它将自动在根注入器中提供。

    有关此的文档可以在以下位置找到: Angular providers .

    如果您使用的是angular v5,那么您应该只在appmodule中提供服务。

        2
  •  2
  •   diopside    1 年前

    在您的服务中,编写如下新方法:

    popupSource = new BehaviorSubject<any>('');
    
    getPopupSource() { 
       return this.popupSource.asObservable();
    }
    

    而不是直接订阅主题本身。你可以在订阅时添加'asobservable()'部分,而不是创建一个全新的方法,但是我喜欢单独的方法,这样我就可以将主题保持私有,而且我通常会在一个应用程序的不同位置多次订阅某个内容,所以它减少了重复。

    在您的组件中:

    this._service.getPopupSource().subscribe( result => { etc...})
    

    编辑:

    演示你的场景- https://stackblitz.com/edit/angular-n6esd5