代码之家 › 专栏 › 技术社区 › Gary McGill

结构指令是否可以使用@contentchild引用子组件?

angular-components angular-directive angular

Gary McGill · 技术社区 · 6 年前

如果我有自定义指令 ParentDirective 和自定义组件 ChildComponent 排列方式如下:

<div appParent>
  <app-child></app-child>
</div>

…那我就可以用了 @ContentChild 在涉及组件的指令中:

@ContentChild(ChildComponent) child: ChildComponent;

见 this StackBlitz 在这里工作。(它登录到控制台以显示 child 成员已设置)。

但是,如果我将AppParent更改为 结构的 指令,然后 小孩 从未设置成员。

<div *appParent>
  <app-child></app-child>
</div>

见 this StackBlitz .

不能用吗 @内容儿童 有结构指示吗?

1 回复 | 直到 6 年前

SeleM 6 年前

我认为你不能,这是由于设计所使用的角两种类型的指令。通过创建指令 TemplateRef 然后通过注射 createEmbeddedView 属于 ViewContainerRef 将模板生成为DOM中的同级,而不是子级 . 因此,安格尔的注射剂也尊重这一点,所以孩子和创造的地方看不到彼此。你可以把它画成一个额外的图层。

Here 是的源代码 创建嵌入视图

  createEmbeddedView(context: any): EmbeddedViewRef<any> {
    return new ViewRef_(Services.createEmbeddedView(
        this._parentView, this._def, this._def.element !.template !, context));
  }

如你所见,它返回一个新的 ViewRef 注射的地方 context .

More details here.

推荐文章

Kael · 在html表格中显示关系api数据-角度

3 年前

Ajith · 如何在angularjs4中触发另一个组件的点击事件函数

7 年前

krv · 使用父对象上的指令获取嵌套元素

7 年前

MHOOS · 使用md列表项设置角度材质接触表单的样式

8 年前

Petya Naumova · 如何从内部使用部分指令的组件访问DirectivesModule?

8 年前

zb22 · 带表格的角度指令

8 年前

AndreaNobili · 这个Angular 2自定义指令是如何工作的?

8 年前

Milan Kamilya · 无法从组件调用模型类的方法。angular2中的html

8 年前

Rhushikesh · 如何在angularjs中测试指令是否加载

8 年前

Kangze Huang · ES6玩得很好。如何使用它。没有controllerAs的角度指令内的someFunction()?

9 年前