javascript - 全局发射事件

Question

我想要实现的是我想在 angular2 中全局发出一个自定义事件并让多个组件监听它，而不仅仅是父子模式

在我的事件源组件中，我有

export class EventSourceComponent{

  @Output() testev = new EventEmitter();

  onbtnclick(){
    this.testev.emit("i have emitted an event")
  }
 }

现在我想让其他组件得到这个事件

export class CmpTwoComponent{

    //here get the emitted event with data
  } 

我如何实现上述目标？

Answer 1

您可以为此使用共享服务。

export class EventSourceComponent{
    constructor(private sharedService : SharedService){}


      onbtnclick(){
        this.sharedService.testev.next("i have emitted an event")
      }
 }

export class CmpTwoComponent{

//here get the emitted event with data

   constructor(sharedService : SharedService){

      sharedService.testev.subscribe((event)=>{console.log(event)})
   }

} 

然后 sharedService 将是

@Injectable()
export class SharedService{

   public testev = new Subject()

}

显然，如果您仍然需要 Output 以便父组件能够正常订阅，您也可以添加它:

export class EventSourceComponent{

    @Output() testev = new EventEmitter();
    constructor(private sharedService : SharedService){}


      onbtnclick(){
        this.testev.emit("i have emitted an event")
        this.sharedService.testev.next("i have emitted an event")
      }
 }