迭代相同组件angular2的多个@ViewChild实例

Question

我有一个带有ParentComponent的Ionic 2应用程序,调用ChildComponent @ViewChild方法来启动多个ChildComponents.其中一个ChildComponents在视图中使用不同的参数实例化两次,如下所示:

<ChildComponent [startFrom]="0" [limitTo]="1"></ChildComponent>
<ChildComponent [startFrom]="1" [limitTo]="1"></ChildComponent>

在离线/在线设备状态更改后,我调用ChildComponent的方法来更新它返回的项目列表.

@ViewChild(ChildComponent) childComponent: ChildComponent;

ngOnInit(): void {
    this.networkService.connectSubscription(() => {
        this.childComponent.getItems();
    });
}

这里的问题this.childComponent只是获取两者的第一个ChildComponent实例.

有没有办法通过相同@ViewChild组件的多个实例进行迭代,所以我可以做这样的事情this.childComponent1.getItems()和this.childComponent2.getItems()？

谢谢你的帮助.

Answer 1

@ViewChildren(ChildComponent) childComponents: QueryList<ChildComponent>;

ngAfterViewInit(): void {
    this.networkService.connectSubscription(() => {
        this.childComponents.toArray();
    });
}