angular - 无法为该属性构建查询，因为未定义查询选择器

Question

目前 Angular 2 中的一个组件存在其他组件存在的这个问题。 “主要”组件的组件可以在层次结构中多次存在。

但是我收到这个错误:“由于未定义查询选择器，无法为“SidenavLinkComponent”的属性“navComponent”构建查询”

SidenavLinkComponent:
@ContentChild(SidenavNavComponent) navComponent: SidenavNavComponent;

SidenavNavComponent:
@ContentChildren(SidenavLinkComponent) linkComponents: QueryList<SidenavLinkComponent>;

我做了这个 slim plunker，问题就在这里: Plunker

我不知道为什么会这样。

Answer 1

这是因为 SidenavComponent 和 SidenavNavComponent 之间存在循环依赖。可以使用 forwardRef 解决.也不要忘记导入它:

import { forwardRef } from '@angular/core';

@ViewChild(forwardRef(() => SidenavNavComponent))
private navComponent: SidenavNavComponent;

Plunker example