Angular @未填充ContentChildren

我有三个组件：应用程序、父级和子级：

应用程序组件

@组件({
选择器：“应用程序”，
指令：[父，子]，
模板：“Heree”
})
导出类AppComponent{
构造函数（）{
}
}

父组件

@组件({
选择器：'父'，
模板：“家长”
})
导出类父类{
@ContentChildren（Child）children:QueryList；
ngAfterContentInit（）{
console.log（this.children）；
}
}

子组件

@组件({
选择器：'子'，
模板：“孩子”
})
导出类子类{
}

正如您在父组件中所看到的，我尝试使用

@ContentChildren

获取子组件列表，使用

Child

类型作为选择器。但是，这似乎不起作用-内容子列表始终未定义

在

ngAfterContentInit（）

方法中，我希望填充内容子项

我错过什么了吗

[更新]

因此，当所有三个组件都在同一个文件中时，问题就存在了（请参阅控制台调试窗口，我在其中输出内容子项）：

如果它们位于不同的文件中，问题就会消失：

通常，为了便于学习，我只会将所有组件放在同一个文件中。但这让我好奇。有人知道为什么行为不同吗？

您需要使用来引用尚未定义的类。看见记住

@组件({
选择器：'父'，
模板：“家长”
})
导出类父类{
@ContentChildren（forwardRef（（）=>Child））子级；//
UPDMark Rajcok指出了一篇关于angular2中正向引用的优秀文章（参见下面的评论）。必须阅读：。
如果子组件在构造函数中引用父组件，也会发生这种情况；Angular不喜欢循环引用

我只需要为父级->子级通信选择一种方法：使用
ContentChildren
或在子级的
构造函数中使用父级组件

@Component()
export class Parent {
  @ContentChildren(Child)
  private children: QueryList<Child>;
}

@Component()
export class Child {
  constructor(
    // !! Remove the following line to make the ContentChildren "work" again.
    @Optional() parent: Parent
  ) { }
}

@Component（）
导出类父类{
@满足儿童（儿童）
私生子女：QueryList；
}
@组件（）
导出类子类{
建造师(
//！！删除以下行以使ContentChildren再次“工作”。
@可选（）父项：父项
) { }
}
您需要添加
{substands:true}
以包括嵌套子级

@Component({
    selector: 'parent',
    template: '<div><h1>Parent</h1><ng-content></ng-content></div>'
})
export class Parent {
    @ContentChildren(Child, { descendants: true }) children: QueryList<Child>;
    ngAfterContentInit() {
        console.log(this.children);
        console.log(this.children.length);
    }
}

@组件({
选择器：'父'，
模板：“家长”
})
导出类父类{
@ContentChildren（Child，{后代：true}）children:QueryList；
ngAfterContentInit（）{
console.log（this.children）；
console.log（this.children.length）；
}
}

-True以包括所有子代，否则仅包括
指导孩子们

孩子们在DOM中可见？我刚刚试过（在Dart中）它正在工作。你有没有尝试过比
QueryList
更宽松的变量类型，比如
any
@GünterZöchbauer我尝试过将类型更改为any，但问题仍然存在。它似乎与所有三个组件都在同一个文件中有关。我无法在Dart中复制（如果这有帮助的话），它也适用于一个文件中的所有内容。它是：）。我曾在plnkr和VS2015中尝试过它，它的同一个问题…奇怪+1，请将我转到帖子。OP，注意，在同一个文件中也适用。仅供参考，
forwardRef（）
的用法在页面底部的“附录：为什么我们建议每个文件使用一个类”中提到第节。指南还建议阅读更多关于何时使用
forwardRef（）
@MarkRajcok的信息。感谢您的thoughtram帖子。我已经添加了答案的链接。