AngularJS ng-cloak examples

AngularJS ng-cloak 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. It can be used in two ways

  1. Using ng-cloak attribute
    <div ng-cloak>{{ 'hello' }}</div>

  2. Using class ng-cloak
    <div class="ng-cloak">{{ 'hello' }}</div>

For the best result, the angular.js script must be loaded in the head section of the html document.

Example

<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular.min.js"></script>

<div ng-app="myApp" ng-controller='MyCtrl'>
  <input ng-model="name" ng-init="name='John'"><br>
  <div ng-cloak>name: {{name}}</div>
</div>


<script>
  var module = angular.module('myApp', []);
  module.controller('MyCtrl', function($scope) {});
</script>
refresh
Share this article: share on Google+ share on facebook share on linkedin tweet this submit to reddit

Comments

Click here to write/view comments