angular使用发布订阅

发布时间 2023-03-29 10:39:48作者: 抽风的皮鞭

1. 单独新建一个service文件
ng g service 服务名

2. 编辑service文件

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

@Injectable({
    providedIn: 'root'
})

export class MessageService {

    constructor() { }

    private subject = new Subject<any>();

    //发布消息
    send(message: any) {
         this.subject.next(message);
    }

    //订阅消息
    get(): Observable<any> {
        return this.subject.asObservable();
    }
}

 

3. 在要发布消息的组件引入服务

import { MessageService } from './XXX';
...
constructor(private subMsg: MessageService){}
...
// 发布消息
this.subMsg.send(data)

 

4. 在要订阅消息的组件引入服务

import { MessageService } from './XXX';
...
constructor(private subMsg: MessageService){}
...
// 订阅消息
this.subMsg.get().subscribe(res=>{
    console.log(res);
})