ng-cloak 指令用于在 AngularJS 应用在加载时防止 AngularJS 代码未加载完而出现的问题。
AngularJS 应用在加载时,文档可能会由于AngularJS 代码未加载完而出现显示 AngularJS 代码,进而会有闪烁的效果, ng-cloak 指令是为了防止该问题的发生。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
.ng-cloak{display: none;}
</style>
</head>
<body ng-app="hd">
<div ng-controller="ctrl" ng-cloak class="ng-cloak">
<h1 ng-bind="name"></h1>
{{name}}asdasd
</div>
</body>
</html>
<script src="angular.min.js"></script>
<script>
var m = angular.module('hd',[]);
m.controller('ctrl',['$scope',function($scope){
$scope.name='我收好人';
}])
</script>
在需要包含ng表达式元素上面加上ng-cloak这个属性,并同样加上一个ng-cloak这个类,然后在css样式中给“display:none;”这样的属性。