Question

我有3个组件，GenComponent，GenComponentGroup和SpecialComponent。 SpecialComponent是一个包含GenComponent的包装器组件，并对其Input数据进行一些预处理以创建新的GenComponent，例如：

@Component({
  selector: 'special-component',
  template: `<gen-component [var1]="specialVar1"></gen-component>`
})
export class SpecialComponent {
  @Input() specialVar1;
}

GenComponentGroup使用<ng-content>，因此在模板中我可以执行以下操作：

<gen-component-group>
  <gen-component [var1]="0"></gen-component>
</gen-component-group>

然后GenComponentGroup可以使用：

访问其GenComponents

@ContentChildren(GenComponent) genComps: QueryList<GenComponent>;

我的问题是，我还需要访问GenComponents中嵌入的SpecialComponents。例如，给出以下模板：

<gen-component-group>
  <gen-component [var1]="0"></gen-component>
  <special-component [specialVar1]="1"></special-component>
</gen-component-group>

GenComponentGroup需要一个列表，其中包含GenComponent中嵌入的第一个var1=0（GenComponent}和SpecialComponent（var1=1 }）。我在使用和不使用{ descendants: true}时尝试了@ContentChildren，并且都没有返回GenComponent中嵌入的SpecialComponents个实例。有关如何实现这一点的任何想法？

Angular 2+：如何访问嵌入在另一个组件中的ComponentChildren？

0 个答案: