如何在单变量中访问子组件的属性和方法？

Question

我有一个父组件和多个子组件。

<parent>
  <child1></child1>
  <child2></child2>
  ...
</parent>

为了在父子节点之间进行通信，我可以使用事件装饰器(@Input/@Output)。或者，我可以像下面这样使用多个@ViewChild来访问子属性和方法。(不考虑服务和可观察性)

@ViewChild('child1') child1: Child1;
@ViewChild('child2') child2: Child2; 
//.... so on

我不想使用事件装饰器以及多个@ViewChild来存储每个子组件的引用。

在angular中有没有类似@ViewChild的方法，我可以在一个变量中获得所有孩子的引用，然后迭代到该变量以访问每个孩子的属性和方法？

感谢您的帮助！

Answer 1

如果您指的是相同组件的子组件，而不是示例中的和，并且您实际上有多个组件实例，如：

<some-container>
  <app-child></app-child>
  <app-child></app-child>
  <app-child></app-child>
</some-container>

然后你可以通过@ViewChildren装饰器获得所有它们，如下所示：

@ViewChildren(AppChildComponent) public QueryList<AppChildComponent>;

你可以使用QueryList中存在的'forEach‘方法来迭代它们。