Множественные селекторы на Angular ng-content

Я знаю, что можно иметь несколько ng-contentс разными селекторами для проецирования содержимого в слоты. например

<ng-content select="h1"></ng-content>
<ng-content select="span"></ng-content>

Мой вопрос, можно ли иметь несколько селекторов на тот же экземпляр изng-content, например

<!-- this doesn't work -->
<ng-content select="h1, h2, h3"></ng-content>
<ng-content select="span, div"></ng-content>

аналогично тому, как вы можете использовать одно и то же правило CSS для нескольких селекторов, т.е.

h1, h2, h3 {...}
div, span {...}

2 ответа

<ng-content select="[input], [form-field]"></ng-content> должно сработать!

awesome.component.html

<ng-content select="[input],[form-field]"></ng-content>

even-more-awesome.component.html

<awesome>
 <h3 input>Foo!</h3>

  <h2 form-field>bar</h2>

  <h1 input form-field>foo & bar!</h1>
</awesome>

StackBlitz.

Как оказалось, это действительно работает:

<ng-content select="h1, h2, h3"></ng-content>

однако это не так:

<ng-content select="[input], [form-field]"></ng-content>

В любом случае вам действительно не следует этого делать, поскольку, если вы все равно создаете настраиваемый атрибут, вы должны сделать его динамическим.

Другие вопросы по тегам