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. HDU 5744 Keep On Movin

    Keep On Movin Time Limit: 4000/2000 MS (Java/Others)    Memory Limit: 65536/65536 K (Java/Others)Tot ...

  2. Winform之SpreadSheetGear转DevExpress.XtraSpreadsheet.v13.2 z

    DevExpress.XtraSpreadsheet.v13.2 允许用户创建.管理.打印.转换spreadsheet文件而不需要用户安装Office. 什么是Spreadsheet 可以看到最后就是 ...

  3. 让Apache支持ASP.NET

    Apache是目前广泛使用的一种网络服务器程序,不仅在UNIX/LINUX平台上被大量使用,而且在Windows平台上也有许多站点放弃了IIS 而转向Apache..NET是微软推出的功能强大的开发技 ...

  4. linux的文件属性介绍、目录及路径表示方法

    一.认识linux文件 认识linux下的文件需要先学习命令:ls. 该命令用于显示指定目录下的内容,其中最常用的参数有: -l显示目录和文件的完整属性信息 -a显示所有文件和目录,包含隐藏文件和目录 ...

  5. TortoiseHg简单的入门使用说明

    参考资料: 互普的 TortoiseHg使用说明_百度文库 Mercurial(Hg)基本操作 - Tim Gong - 博客园 Mercurial与TortoiseHg使用入门教程(转) - mee ...

  6. 不知道帐号密码的情况下完全重装Mac Min的OS X10.7系统

    现状: 1.原系统OS X 10.7 2.老账号不知道密码 3.Mac小盒子 目的: 1.删除老账号 2.更新系统到10.9以上 尝试过程1: 1.按住option键 + 开机 2.选择“磁盘工具” ...

  7. ASP.NET MVC之Html.RenderAction

    WEB窗体模式开发惯了,切入MVC模式,好多东西都不懂,每一步都要查资料. 初步得来的一些知识点体会是: _Layout.cshtml就相当于母版页 然后partical视图(部分视图)就是用户控件. ...

  8. [算法] 冒泡排序 Bubble Sort

    冒泡排序(Bubble Sort,台湾另外一种译名为:泡沫排序)是一种简单的排序算法.它重复地走访过要排序的数列,一次比较两个元素,如果他们的顺序错误就把他们交换过来.走访数列的工作是重复地进行直到没 ...

  9. RabbitMQ (四) 路由选择 (Routing) -摘自网络

    本篇博客我们准备给日志系统添加新的特性,让日志接收者能够订阅部分消息.例如,我们可以仅仅将致命的错误写入日志文件,然而仍然在控制面板上打印出所有的其他类型的日志消息. 1.绑定(Bindings) 在 ...

  10. 搭建Titanium开发环境

    轻松制作 App 再也不是梦! Titanium Mobile 让你能够使用你所熟悉的 web 技术,制作出如同使用Objective-C 或 Java 写出的 Native App. 除了有多达三百 ...