举例:
<!DOCTYPE html> <html lang="en"> <head> <Meta charset="UTF-8"> <title>Document</title> <style> /*[ng-cloak] 属性选择器 匹配所有包含这个属性的元素*/ .ng-cloak,[ng-cloak] { display: none; } </style> </head> <body ng-app> <!-- 闪烁就是 表达式 在angularJS 还没识别之前 本来就是直接输出 然angular过了几百毫秒就识别了表达式 然后把大括号去掉 --> <!-- 原因就是angularJS 的代码加载需要时间 --> <!-- ng-cloak 这个类名或者属性 等angularJS加载出来之后就会把他删掉 --> <h1 ng-cloak class="ng-cloak">{{999999}}</h1> <h1 ng-cloak>{{"你好"}}</h1> <h1 ng-cloak>{{1+2}}</h1> <h1 ng-bind="‘要绑定的值‘"></h1> <h1 ng-bind="‘萨瓦迪卡‘"></h1> <!-- 1.引包 --> <script src="node_modules/angular/angular.js"></script> <!-- 1. 是吧angularJS的引包代码放到表达式的前面引入进来 (但是这种方式不推荐 因为JS代码是放到后面执行的因为JS代码影响页面渲染 不能再前面引入 得等页面和CSS加载完了再加载JS) --> <!-- 2. 使用ng-bind的方式 实现绑定表达式(或者值)到标签上 这种方式由于是angular的指令代码 只能等angualrJS出来了才能识别 才会生效 所以不会出现闪烁问题 --> <!-- 3. 使用ng-cloak类名或者属性 然后给这个类名加上display:none的属性 angular执行的时候会把这个类名或者属性删除 --> <!-- 因为闪烁是样式性问题就用样式解决他 同时也保留了之前写表达式的写 --> </body> </html>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 [email protected] 举报,一经查实,本站将立刻删除。