前端开发那些事儿

angular 学习记录(二)

2021-07-01  本文已影响0人  Grit_1024

内置指令

1.1 ngIf

接收一个布尔值,并据此让一整块DOM树出现或者消失
ngIf 指令并不是使用css来隐藏元素的,他会把这些元素从Dom中物理移除

1.png
image.png

1.2 ngFor

a.第一种:


image.png
image.png

b.第二种:全特性使用


image.png
image.png

1.3.ngSwitch

image.png

1.4.ngStyle

样式绑定,可以设置内联样式

1.5.ngStyle

a.[style.style-prototype]
image.png
b.带单位
image.png
c.ngStyle

同时间操作多个属性,可以传入一个对象



image.png
1.6 class和【class】

1.class和【class】共存的时候,如果[class]有值会覆盖class


image.png
此时是class="container"

2.通过【class】可以做样式的逻辑判断
这个类的存在与否是由变量控制


image.png
1.7 ngClass

同时操作多个class类,可以传入一个对象


image.png
1.8 ngNonBindable

当我们想告诉angular不要编译或者绑定页面中的某个特别部分时,要使用ngNonBindable指令


image.png
上一篇下一篇

猜你喜欢

热点阅读