角度：在组件之间共享数据

Question

比方说，我有3个组成部分，即A，B和C。组件A的HTML中包含以下内容：

// a.component.html
<b-component></b-component>
<c-component></c-component>

组件A是否可以将数据发送到B和C中的每一个，并告诉它们不时更新？

顺便说一句，问题在Angular，而不是AngularJS。

Answer 1

是的，您可以按照以下步骤进行操作。来自组件a的data_item将发送到组件b。

a.component.html

<b-component [data]="data_item"></b-component>

b.component.ts

@Input()
data: any

此处的简单演示：https://stackblitz.com/edit/angular-data-to-component?file=src/app/app.component.html

Answer 2

https://angular.io/guide/component-interaction 该文档非常有用。您可以从组件A设置@output，并在组件B和C中设置@input。当该变量的值从A发出一个事件时，该事件必须在B和C中处理

这是示例代码https://stackblitz.com/edit/angular-component-interaction-4?file=app%2Fvoter%2Fvoter.component.ts

Answer 3

使用A的属性作为B和C的输入参数

Answer 4

https://angularfirebase.com/lessons/sharing-data-between-angular-components-four-methods/#Unrelated-Components-Sharing-Data-with-a-Service

由于组件无关，因此通过Service共享数据是一个不错的选择。