Angular - 在兄弟组件之间共享数据而不在实例之间共享

Question

我正在编写一个包含三个独立组件的模块。这些组件协同工作，因此使用服务来帮助跟踪所有内容是有意义的。

|    
|- wrapper.component.ts
|
|- wrapper.service.ts
|
|- wrapper.module.ts
|
|- child-component1.component.ts
|
|- child-component2.component.ts

问题在于，如果您在应用程序中创建基础组件的两个实例，则服务会在组件的两个实例之间共享数据。

在兄弟之间共享数据而不在组件的所有实例之间共享数据的正确方法是什么？

Answer 1

在组件级别提供服务：

@Component({
    ....
    providers: [myService]
})

这样，服务实例在组件及其子组件之间共享，而不是组件的其他实例。

Answer 2

1. 您可以使用事件发射器从子 1 组件向父组件发出事件
2. 使用从子 1 发出的数据更改从父到子 2 的输入
3. 访问孩子 2 的 ngOnChange 中的数据