Меню ×
ng-content

ng-content

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>
	

Похожие материалы

TypeScript - это суперсет, расширяющий возможности JavaScript наличием типов, классов, интерфейсов и т.д. Браузер не умеет выполнять TypeScript файлы, по этому их нужно компилировать в JS.

Работа с формами. Шаблонный подход (Template-driven)

Что такое структурные директивы. Встроенные и собственные структурные директивы.

наверх