The ng-cloak is a
special type of directive with used to which used to prevent un-compile element
being displayed. We can say that ng-cloak directive hold and wait to incoming
data's.
In the below code, ng-cloak directive
prevent to display un-compiled user name and Its not displayed before compile
the user name.
1. Without using the ng-cloak the output will display the {{ name }}
1. Without using the ng-cloak the output will display the {{ name }}
2.
With using the ng-cloak the output will display blank.
Syntax:
<div ng-cloack> <div ng-if="!users.isValid"> {{ name }} </div> </div>
Example,
<!DOCTYPE html> <html lang="en"> <head> <title>Using ng-cloak directive </title> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.5/angular.min.js"></script> <script> var app = angular.module("ngApp", []); app.controller('ngController', function($scope) { $scope.name = "Anil Singh"; $scope.users = { isValid: true }; }); </script> </head> <body ng-app="ngApp"> <div ng-controller="ngController"> <div ng-cloak ng-if="!users.isValid"> {{ name}} </div> </div> </body> </html>
The Result looks like,
About Blogger
|
Hey! I am Anil Singh. I am Active Blogger, Writer and Programmer. I love learning new technologies, programming, blogging and participating the forum discussions more...
|
0 comments:
Post a Comment