Angular开发(四)-关于angular2的通用指令

xiaoxiao2021-02-27  352

一、 关于angular中指令包括三类

通用指令路由指令表单指令 本次仅仅是讨论通用指令,别的指令将在今后讨论

二、angular的通用指令包括:

NgClassNgStyleNgIfNgFor

三、关于ngClass、ngStyle在前面章节已经介绍了,如有不清楚的可以返回去查看关于属性绑定章节

四、NgIf的介绍

ngif指令绑定的是一个布尔值,当返回true的时候DOM树节点将新增一个元素及其子节点,如果返回false,那么就移除这个节点,与ngClass中定义的dispaly:none的区别在于直接干掉DOM节点

<div class="box" *ngIf="isShow">第一个</div> //ts文件 isShow:boolean = true;

五、NgFor的介绍

NgFor可以简单的理解为就是一个for循环,循环出一组数据,其中要注意的NgFor里面有个index表示序列号

<li *ngFor="let item of dataSet;let i = index"> <span>{{item.name}}</span>----{{i+1}} </li> //ts文件 dataSet = [ {"id":0,"name":"张三"}, {"id":1,"name":"李四"}, {"id":2,"name":"王五"}, ]
转载请注明原文地址: https://www.6miu.com/read-1555.html

最新回复(0)