Angular 2父组件调用多个子组件方法

【问题标题】：Angular 2 Parent component calls multiple child components methodAngular 2父组件调用多个子组件方法
【发布时间】：2017-05-07 11:07:23
【问题描述】：

我正在构建一个单独的框作为angular 2 components，它们正在将照片上传到服务器，然后如果从服务器接收到成功，则发送请求以在数据库中创建记录。结构很简单，如下所示。可以有n 孩子，当用户单击按钮上传所有我需要在每个孩子中调用上传方法时。通常我会使用 service 和 subscribe 方法，但我想添加队列以防止服务器过载。有没有办法在这个组件逻辑中实现呢？

<parent>
   <child>
   <child>
   ...
   <child>
</parent>

【问题讨论】：

标签： angular angular-components

【解决方案1】：

您可能会考虑将您的每个孩子的数据输出到您的父组件中，然后您可以根据需要逐个发送每个数据。

例如：

<parent>
   <child (dataToSend)="handleDatatoPush($event)"></child>
   <child (dataToSend)="handleDatatoPush($event)"></child>
   ...
   <child (dataToSend)="handleDatatoPush($event)"></child>
</parent>

父组件：

handleDatatoPush(dataReceive: any){
//your logic even if i would do something like that
this.dataToSend.push(dataReceive);
}

然后你就可以在你的 sendAll 函数中一一发送你的数据了。

【讨论】：

这看起来很干净的方式来实现它。谢谢，我会试试的:)。