Angular. Структурные директивы *ngFor и *ngIf
В этом видео мы рассмотрим структурные Angular директивы — *ngFor и *ngIf, а также специальную директиву ng-container
В Angular есть три вида директив
- структурные — они изменяют структуру DOM.
- атрибуты — изменяют вид/поведение элемента.
- компоненты
Структурные директивы начинаются с символа *. Директивы *ngIf отображает контент, если вычисляемое условие выражения равно true. Директивы *ngFor отрисовывает коллекцию данных (массивы). Директива ng-container позволяет не использовать лишние html тэги.
Код урока (компонент)
<button (click)="getUser()">{{title}}</button>
<p *ngIf="user">{{user.login}}</p>
<ng-container *ngIf="user">
<ul *ngFor="let role of user.roles">
<li>{{role}}</li>
</ul>
</ng-container>
0 Комментариев