Angular事件之不同组件间传递数据的方法

ng g service event 

import { Injectable } from '@angular/core';
import { Subject } from 'rxjs';

@Injectable({
  providedIn: 'root'
})
export class EventService {
  // 构建Subject的实例，用来完成事件的发布和订阅
  private subject = new Subject < any > ();
  constructor() {}
  publish(value: any, err: any) {
    if (value !== undefined) {
      // 将新的事件放入next队列中
      this.subject.next(value);
    }
    if (err !== undefined) {
      // 将错误放入error队列
      this.subject.error(err);
    }
    // 表示当前事件结束
    this.subject.complete();
  }

  subcribe(handler: {
   next: (value) => void,
   error: (err) => void,
   complete: () => void
  }) {
    this.subject.asObservable().subcribe(handler);
  }
}

@NgModule({
 declarations: [],
 imports: [],
 providers: [EventService],
 bootstrap: [AppComponent]
})
export class AppModule { }

export class AComponent implements OnInit {
 constructor(
  private event: EventService
 ) { }
 ngOnInit() {
 }
 someThingChanged(data) {
  // 发布事件
  this.event.publish({
   // 可以定义一个事件类型，实现多个不同类型事件的发布
   type: 'event_type_you_want_define',
   // 可以携带任何数据，并通过事件发布出去
   data: data,
   ohter: 'ohter things you want to pass out'
  }, err);
 }
}

export BComponent implements OnInit {
 constructor(
  private event: EventService
 ) { }
 ngOnInit() {
   // 在初始化方法中，可以完成对事件的订阅工作
  this.event.subject({
   next: value => {
    // 可以通过约定事件类型，在这里进行检查，从而完成不同的逻辑
    // do something with value
   },
   error: err => {
    // handle err
   },
   complete: () => {
    // handle complete
   }
  })
 }
}