angular2非父子关系组件的交互

定义一个服务,利用这个服务实现组件间的双向通信;

用法:在一个组件中发布消息,通过服务可广播一条消息,如果别的组件订阅了该消息,则可以接收到。

服务的定义:

angular2非父子关系组件的交互_第1张图片

在一个组件中广播消息:

import {MessageService}from "../../shared/service/message.service";  //引入该服务

constructor(private messageService: MessageService) {

}                                                                                                         //在构造器中注入服务

this.messageService.sendMessage("this message");                   //发布消息

在其它某一个组件中订阅该消息:

import {MessageService}from "../../shared/service/message.service";  //引入该服务

constructor(private messageService: MessageService){

this.subscription =this.messageService.getMessage()

.subscribe(message => {

console.log(message )                                                                  //接收该消息

});

}

你可能感兴趣的:(angular2非父子关系组件的交互)