Angular 2 子组件引用父组件

Question

我有一个包含三个组件的应用程序。应用程序、编辑 View 、对话框。

应用程序组件包含 EditView 组件，它可以包含许多其他 EditView 组件和一个 Dialog 组件(如果 Dialog 组件在页面上可见)。

对话框组件包含应用程序组件。当我把它放在 Dialog 组件的声明路径中时:

directives:[Application]

我收到这个错误:

组件“Dialog”的 View 上出现意外的指令值“undefined”

在某些情况下，是否有可能拥有子组件可以包含来自上层组件的结构？

如果我从 Dialog 中删除 Application 组件或用其他组件替换它，它工作正常。

兹拉亚

Answer 1

将它放在指令列表中是行不通的，但您仍然可以通过将其注入(inject)子指令的构造函数来访问父组件:

constructor(@Host(Application) application: Application) {

}

父组件可以使用@Query获取子组件的实时列表:

constructor(@Query(EditView) editViews: QueryList<EditView>){

}