Angular 我们是否可以使用相同的服务在多个组件对之间使用相同的服务进行通信

假设我的页面有4个组件Comp1、Comp2、Comp3和Comp4（所有不相关的组件）。如果我想在Comp1和Comp2之间通信。同时在Comp3和Comp4之间。是否可以使用相同的服务在它们之间进行通信？

简短的回答是，根目录下的可注入服务可以作为组件之间通信的一种方式。使用EmitEvent，您可以广播和订阅特定呼叫

@Injectable({
    providedIn: 'root'
})
export class myInjectableService {
    public message: EmitEvent<string> = new EmitEvent();

    public SendMessage(msg:string): void {
         this.message.emit(msg);
    } 
}



@Component({
    selector: "sendComponent",
    template: "<div (click)='SendMessage()'></div>"
})
export class SenderComponent {
    constructor(private injectable: myInjectableService) {}
    public SendMessage(): void {
        this.injectable.SendMessage('Test');
    }
} 



@Component({
    selector: "receiveComponent",
    template: "<div>{{Message}}</div>"
})
export class ReceiverComponent {
    constructor(private injectable: myInjectableService) {
        this.injectable.subscribe((msg) => {
            this.Message = msg;
        })
    }
    public Message: string = null;
} 

@可注入({
providedIn:'根'
})
导出类myInjectableService{
公共消息：EmitEvent=newemitevent（）；
公共发送消息（消息：字符串）：无效{
this.message.emit（msg）；
} 
}
@组成部分({
选择器：“sendComponent”，
模板：“”
})
导出类发送器组件{
构造函数（私有可注入：myInjectableService）{}
public SendMessage（）：void{
this.injectable.SendMessage（'Test'）；
}
} 
@组成部分({
选择器：“receiveComponent”，
模板：“{{Message}}”
})
导出类接收组件{
构造函数（私有可注入：myInjectableService）{
this.injectable.subscribe（（msg）=>{
this.Message=msg；
})
}
公共消息：string=null；
} 

是的，你能做到

只需声明主模块中提供的服务（如果您没有触及默认设置，则默认设置为

appModule

）

该服务的外观如下所示：

import { Injectable } from "@angular/core";

import { Subject } from 'rxjs';

@Injectable()
export class DataService { 
    private $data = new Subject<CommunicationData>();
    public dataReceivedEvent = this.$data.asObservable();

    public setDataToSend(data: CommunicationData): void {
        this.$data.next(data);
    }
}

现在只需将此服务作为DI注入到您喜欢的每个组件中

constructor(
  private dataService: DataService
) { }

要从这些组件发送数据，只需执行以下操作：

private sendData(): void { 
  this.dataService.setDataToSend({
    eventName: 'YourCustomEvent',
    data: null //can be anything
  });
}

要捕获事件，只需执行以下操作（在组件的onInit生命周期中）：

---

这样，您将只拥有一个服务，用于保存所有组件之间的通信。

我想回答是。但是你能描述一下你已经做了什么和你想做什么吗？谢谢@jacopo。这是一个有趣的解决方案。我目前正在将此解决方案应用到一个项目中，该项目有大约120个组件和300万行代码，我想说它工作起来很有魅力。

private sendData(): void { 
  this.dataService.setDataToSend({
    eventName: 'YourCustomEvent',
    data: null //can be anything
  });
}

this.dataService.dataReceivedEvent
  .subscribe(result => {
    if(result.eventName === 'YourCustomEvent') { 
      //foo
    } else if (result.eventName === '...') { 
      // something else
    } //and so on
  });