在这个场景中,我有 3 个组件,即组件 1、组件 2、组件 3。 组件 2 和组件 3 托管在组件 1 中 我想在单击组件 2 中的按钮后将数据发送到组件 3。 提前致谢
最佳答案
您可以使用 Angular 2/4 中提供的 @Input 和 @Output 装饰器方法来实现此目的。
这些使用起来非常简单。只需将共享数据保留在组件 1 中,然后将该数据与组件 2 和 3 进行双向绑定(bind)。确保只要组件 2 或 3 中的任何一个数据发生更改,就触发更改事件。
//for example component 1
@Component({ ... })
export class Component1{
private data: Data = "some data";
}
//component 2 and 3
@Component({ ... })
export class Component2{
@Input() data: Data = "some data";
@Output() dataChange: EventEmitter ...
ngOnChanges(){
this.dataChange.emit(this.data);
}
}
<component1>
<component2 [(data)]="data"></component2>
<component3 [(data)]="data"></component3>
</component1>
关于javascript - 如何在 Angular2 组件之间共享数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45820062/