Angular 2 Parent 组件调用多个 child 组件方法

Question

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

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

Answer 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 函数中一个一个地发送您的数据。

Angular 2 Parent 组件调用多个 child 组件方法

Angular 2 Parent component calls multiple child components method

angular-components

angular