меню

Angular позволяет разместить верстку в теге подключения компонента.

В теге компонента разместим часть кода, который хотим передать в шаблон:

  
<app-server-element 
*ngFor="let serverElement of serverElements"
[srvElement]=serverElement>
  <p>
    <strong *ngIf="serverElement.type === 'server'" style="color: red">{{ serverElement.content }}</strong>
   <em *ngIf="serverElement.type === 'blueprint'">{{ serverElement.content }}</em>
  </p>
</app-server-element>
  

В шаблоне компонента app-server-element, подсвеченный контент будет выведен в теге ng-content:

 
<h1>Server element</h1>
<ng-content></ng-content>
  
Помощь сайту
ЮMoney:
4100 1180 7209 833
Карта Сбербанк:
2202 2080 6183 7127

Возможно, вам будет интересно

Инкапсуляция стилей и ссылки

Режимы инкапсуляции стилей, локальная ссылка в шаблоне Angular. Доступ к шаблону и DOM из компонента с помощью @ViewChild и @ContentChild.

События и жизненный цикл

Жизненный цикл приложения и события в Angular

Директива атрибута

Создание директивы атрибута и использование класса Renderer2 в Angular

Route. Обновление шаблона

Обновление шаблона при динамическом роутинге и отписка от наблюдения