The ngCloak directive is used to prevent the Angular html template from being briefly displayed by the browser in its raw (uncompiled) form while your application is loading. Use this directive to avoid the undesirable flicker effect caused by the html template display.

Add those code to css:

[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak {
display: none !important;
}

Usage:

<div id="template1" ng-cloak>{{ 'hello' }}</div>
<div id="template2" ng-cloak class="ng-cloak">{{ 'hello IE7' }}</div>

See: https://docs.angularjs.org/api/ng/directive/ngCloak

[AngularJS] ngCloak的更多相关文章

  1. AngularJs ngCloak、ngController、ngInit、ngModel

    ngCloak ngCloak指令是为了防止Angular应用在启动加载的时候html模板将会被短暂性的展示.这个指令可以用来避免由HTML模板显示造成不良的闪烁效果. 格式: ng-cloak   ...

  2. 结构-行为-样式-angularJs笔记

    0.关于Ng-app   通过ngApp指令来引导Angularjs应用是一种简洁的方式 ,适合大多数情况.在高级开发中,例如使用脚本装载应用,您也可以使用Bootstrap手动引导AngularJs ...

  3. 使用Angularjs的ng-cloak指令避免页面乱码

    在使用Anguarjs进行web开发或者进行SPA(single page application)开发时,往往会遇到下面这样的问题. 刷新页面时,页面会出现一些乱码,这里的乱码具体是指`{{expr ...

  4. Ng-cloak解决angularJs中的闪烁问题

    引言 上一篇博客写到了使用ng-bind指令解决页面显示{{express}}问题,这次我们来使用另一种方法解决一下. 在使用AngularJS开发评教移动端的时候,我们经常会看见在Chrome这类快 ...

  5. AngularJs解决表达式闪烁的问题(ng-cloak)

    举例: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8 ...

  6. 解决使用angularjs时页面因为{{ }}闪烁的两种方式ng-bind,ng-cloak

    1.HTML加载含有{{ }}语法的元素后并不会立刻渲染它们,导致未渲染内容闪烁(Flash of Unrendered Content,FOUC).我可以用ng-bind将内容同元素绑定在一起避免F ...

  7. 摆脱DOM操作,从TodoMVC看angularJS

    取代jQuery? 我很久之前便听说了angularJS的大名,之前的leader也经常感叹angularJS的设计如何如何精妙,可叹一直没有机会深入了解,国庆长假因为没钱出游,倒是可以对他做一个了解 ...

  8. AngularJS移动开发中的各种坑

    捂脸,辛酸泪ing...... 本文主要涉及部分在移动设备上特有的问题. 相对来说,Jquery侧重DOM操作,AngularJS是以视图模型和双向绑定为核心的. DOM操作的问题 避免使用 jQue ...

  9. AngularJS之初级Route【一】(六)

    前言 这一节我们来讲讲AngularJS中的路由以及利用AngularJS在WebAPi中进行CRUD.下面我们一起来看看. 话题 当我们需要进行路由映射时即用到$route服务,在AngularJS ...

随机推荐

  1. 滑屏 H5 开发实践九问

    滑屏的交互形式自从在 H5 中流行起来,便广泛应用在产品宣传.广告.招聘和活动运营等场景中,作为微信朋友圈广告惯用的形式,其影响力更是得到了强化与放大.如今滑屏H5可谓玲琅满目,数不尽数. 作为一个 ...

  2. jdbc:oracle:thin:@192.168.3.98:1521:orcl(详解)

    整理自互联网 一. jdbc:oracle:thin:@192.168.3.98:1521:orcljdbc:表示采用jdbc方式连接数据库oracle:表示连接的是oracle数据库thin:表示连 ...

  3. hdu 1573 x问题(中国剩余定理)HDU 2007-1 Programming Contest

    只是套模板而已(模板其实也不懂). 留着以后好好学的时候再改吧. 题意—— X = a[i] MOD b[i]; 已知a[i],b[i],求在[1, n]中存在多少x满足条件. 输入—— 第一行一个整 ...

  4. HDU 4325-Flowers(线段树+离散化)

    题意: 给出每个花开花的时间段,每询问一个时间点输出该时间点开花的数量 分析: 线段树的区间更新,单点查询,但发现时间很大,没法存区间,就想到了离散化. 离散化就是把要处理的数据统一起来重新标号. # ...

  5. <转>python version 2.7 required,which was not found in the registry

    安装PIL-1.1.7.win32-py2.7的时候,不能再注册表中识别出来python2.7 方法:新建一个register.py 文件,把一下代码贴进去,保存 # # script to regi ...

  6. JDBC连接工厂类

       看到有些书上数据库连接提供两个工厂类,一个连接工厂类一个关闭工厂类,并且关闭工厂类写了多种重载形式,感觉没有必要,这样写比较简洁一些. /** * 抽象出的连接工厂类,提供连接数据库和关闭连接的 ...

  7. 简易nagios安装

    这段时间一直在进行nagios安装的实验,进行了很多的实验,现在也就是将这些进行一些基础的记录. 本篇主要讲述的是进行nagios的简易安装,在安装完成之后,能够在web页面上看到本地的监控图像, n ...

  8. 使用rpmbuild来创建自己的RPM

    1. 进行创建必须的目录 在6.2的版本中,路径发生了变化,必须在此路径中,否则必须要修改配置文件. 2. 创建脚本文件 编写一个简单的脚本,然后将脚本进行打包为tar.gz格式的压缩文件,并且将其放 ...

  9. bzoj 1025 [SCOI2009]游戏(置换群,DP)

    [题目链接] http://www.lydsy.com/JudgeOnline/problem.php?id=1025 [题意] 给定n,问1..n在不同的置换下变回原序列需要的不同排数有多少种. [ ...

  10. 线段和矩形相交 POJ 1410

    // 线段和矩形相交 POJ 1410 // #include <bits/stdc++.h> #include <iostream> #include <cstdio& ...