Как выбрать контент из внутренних потомков в ng-content
У меня есть компонент под названием tab
у которого есть <ng-content select="[tabItem]"></ng-content>
Иногда tabItem
находится внутри других дочерних компонентов. Моя проблема заключается в том, что Angular выбирает контент из прямых дочерних элементов, а не из внутренних дочерних элементов (app-my-tab), есть ли способ сделать это?
app.component.html
<app-tabs>
<div tabItem>
Tab 1
</div>
<div tabItem>
Tab 2
</div>
<app-my-tab></app-my-tab>
</app-tabs>
мой-tab.component.html
<div tabItem>
My Tab
</div>
<div>
Other content
</div>
Смотрите этот стек
1 ответ
Там нет решения для глубокого отбора. Я думаю, это логично, потому что:
- понять и реальный код легко
- легко отлаживать.
Если вы действительно хотите это сделать, используйте * ngIf в app-my-tab.
Использовать *ngIF
:
- Все элементы в
app-tabs
должен иметьtabItem
атрибут - отправить ваше условие, чтобы показать / скрыть какой-либо другой элемент в
app-my-tab
составная часть. а такжеapp-my-tab
получить это как@Input()
имущество - в
app-my-tab
использование HTML*ngIf
показать или скрыть какой-то элемент
Пример: https://stackblitz.com/edit/deep-ng-content-2gyttv?file=src/app/app.component.html