Angular下的一种发布订阅模式

前言

	发布订阅模式，给任意关系的组件之间（传值，通知对方执行方法）提供了极大的便利（父子，孙子，兄弟），
	它不用考虑组件之间的调用关系，因此非常方便。

---

正文

1. 定义share-msg.service.ts文件

import { Injectable } from '@angular/core';
import { Observable, Subject } from 'rxjs';
@Injectable({
  providedIn: 'root'
})
export class ShareMsgService {
  constructor() { }
  private msg = new Subject<any>();
  //发送消息
  sendMessage(message: any) {
    this.msg.next(message);
  }
  //清除消息
  clearMessage() {
    this.msg.next();
  }
  //获取消息
  getMessage(): Observable<any> {
    return this.msg.asObservable();
  }
}

说明：
· sendMessage()
发布消息
· getMessage() ：
订阅消息
· clearMessage()：
清除消息，用完即毁，节省资源

2. A文件中发布消息

...
import { ShareMsgService } from '@app/shared/service/share-msg.service';
...
  constructor(
    private sms: ShareMsgService,
  ) { }
...

  submitQuery() {
    //这是我的一个业务方法
	//sendMessage()中的参数可以自定义，自己按照
    this.sms.sendMessage({ type: "lj_search_update", data:{test:"testValue"}})
   
  }

3. B文件中订阅消息

...
import { ShareMsgService } from '@app/shared/service/share-msg.service';
import { Subscription } from 'rxjs';
...
constructor(
    private sms: ShareMsgService,
  ) {
    this.subscription = this.sms.getMessage().subscribe(data => {
      if (data.type == "lj_search_update") {
    	//此处处理你的业务逻辑
      }
    })
  }
 ...
 //记得用完即毁，这个时angular生命周期的一个钩子
 ngOnDestroy(): void {
    this.subscription.unsubscribe();
  }

---

没了，就是这些了，当然你还可以选择其他的一些方式，比如@Input()、@Output()、eventEmitter等。