Может ли структурная директива ссылаться на дочерний компонент, используя @ContentChild?

Question

Если у меня есть пользовательская директива ParentDirective и пользовательский компонент ChildComponent, расположенные так:

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

... тогда я могу использовать @ContentChild в директиве для ссылки на компонент:

@ContentChild(ChildComponent) child: ChildComponent;

См. этот StackBlitz , где это работает.(Он регистрируется в консоли, чтобы показать, что элемент child установлен).

Однако, если я изменю appParent на директиву структурная , то элемент child никогда не устанавливается.

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

См. этот StackBlitz .

Нельзя ли использовать @ContentChild со структурными директивами?

Answer 1

Я думаю, что вы не можете, и это из-за дизайна, используемого angular для обоих типов директив.Создание директивы через TemplateRef и внедрение ее через createEmbeddedView из ViewContainerRef генерирует шаблон как родного брата в dom, а не как ребенка .Следовательно, инъекция Angular также учитывает это, поэтому ребенок и место творения не могут видеть друг друга.Вы можете нарисовать его в своем уме как дополнительный дополнительный слой.

Здесь - исходный код createEmbeddedView

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

Как видите, он возвращает новый ViewRef, куда он вводит ваш context.

Подробнее здесь.