AngularJS ng-cloak用法及代码示例

很多时候，AngularJS应用程序会在主应用程序启动时显示HTML文档的闪烁。这将显示AngularJS代码一段时间。 ng-cloak指令的使用是为了防止AngularJS中的元素在短时间内以未完成，不完整，未编译和原始的形式被Web浏览器呈现，同时基本程序仍处于加载的边。本质上，这是为了防止不必要的闪烁影响，该影响在程序加载开始时就多次显示。然后，未完成的数据只是保留并等待传入的数据。

用法:

<element ng-cloak> {{the piece of code}} </element>

例：本示例显示了ng-cloak指令的用法。

<!DOCTYPE html> 
<html> 
<script src= 
"https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"> 
</script> 
    <head> 
        <title>AngularJS | ng-cloak Directive</title> 
    </head> 
     
<div ng-app=""> 
            <body style = "text-align:center"> 
            <h2 style = "color:green">GeeksForGeeks</h2> 
            <h2 style = "color:purple">AngularJS ng-cloak</h2> 
  
            <p ng-cloak>{{ 10 + 10 }}</p> 
  
</body> 
</div> 
</html>

输出：
当我们加载代码时：
ngcut

即使不包含ng-cloak指令，此示例也肯定会加载而不会闪烁。但这告诉我们如何在HTML元素中包含ng-cloak指令。

相关用法

注：本文由纯净天空筛选整理自SohomPramanick大神的英文原创作品 AngularJS | ng-cloak Directive。非经特殊声明，原始代码版权归原作者所有，本译文未经允许或授权，请勿转载或复制。