Повторение корневого тега в index.html

Question

Почему повторение тега <app-root> в моем index.html не имеет никакого эффекта? Например, если мой app.component.html имеет простой Hello World и если я пишу

<app-root></app-root>
<app-root></app-root>
<app-root></app-root>

в index.html, браузер отображает только один Hello World, а не

Hello World
Hello World
Hello World

Answer 1

Это потому, что angular выбирает корневой элемент через:

document.querySelector(selectorOrNode)

, где selectorOrNode - селектор корневого компонента.

Как вы можете догадаться, он всегда будет возвращать только первый элемент.

Если вы хотите применить корневой компонент к нескольким элементам, вы можете использовать ngDoBootstrap, как описано здесь:

• Можно ли запускать одно приложение Angular 2 несколько раз на одной странице?