For the ng-series of instructions, each article write 2-5 bar, otherwise it seems that the article is very short ....
Ngapp
Use this command to automatically start a ANGULARJS application. The Ngapp directive specifies the root node of the application and typically places ngapp on the root node of the Web page, such as <body> or
format : ng-app= "Value"
Value: The name of the current application module.
Using code:
<Ng-app= "Demo"></div>
Note that the 1.3 version before the value can not be set, 1.3 is required, and the module has to be defined, many parts of the online tutorial is 1.3 before the version, so everyone in the use of attention to the issue of the version.
The beast's understanding of this command is actually telling angular that the root node of the application is in me, and after the 1.3 release, tell angular what the name of the module you should execute.
Ngbind
Ngbind tells angular to replace the text content within the specified element with the value of the specified expression, and to change the contents of the text when the value of the expression changes.
format : ng-bind= "value" class= "Ng-bind:value;"
Value: Expression/value
Using code:
<DivNg-app= "Demo"><DivNg-controller= "Testctrl as CTRL"><SpanNg-bind= "Ctrl.hello"></Span> <span class= "Ng-bind:ctrl.world" ></span><br /> < span ng-bind= "Ctrl.hi () "></span> </div> </div>
(function () { angular.module ("Demo", []) . Controller ("Testctrl", Testctrl); functionThis, Vm.hello = "Hello"; vm.world = "World"functionreturn "hi!" ; }; }; }());Ngbind the benefit of binding with respect to {{}} is that the binding code is not exposed when you quickly refresh or open the page.
This does not have to be too much to explain, directly can see that this is a binding data instructions.
Ngbindhtml
Creates a binding method that binds the result of the innerHTML function to the page-specific element.
format : ng-bind-html= "Value"
Value: The string that will be escaped and bound by HTML.
Use with $SCE:
. Hello { width: 300px; height: 300px; background: #ccc; color: red;} <div ng-app= "Demo" Span style= "color: #0000ff;" >> <div = "Democtrl as CTRL" > <div ng-bind-html></div > </div> </div>
(function () { angular.module ("Demo", []) . Controller ("Testctrl", ["$sce", Testctrl]); functionthis; vm.htmltext = ' <div class= ' hello ' >hello wrold</div> '; // OK to output HTML normally };} ());Introduction of Angular-ngsanitize.js Use:
<div ng-app= "Demo" Span style= "color: #0000ff;" >> <div = "Testctrl as CTRL" > <div ng-bind-html></div > </div> </div>
(function () { angular.module ("Demo", ["Ngsanitize"]) . Controller ("Testctrl", [Testctrl]); functionthis; vm.htmltext = ' <div class= "Hello" >hello wrold</div> ';};} ());Ngnonbindable
This instruction tells angular not to compile or bind values to the current DOM element. This command is useful when the content of an element needs to show angular instructions and bindings but let angular ignore his execution. For example, you have a website that needs to show code snippets.
format : ng-non-bindable
Using code:
<span ng-bind = "greeting" ></> <span Span style= "color: #ff0000;" >ng-bind= "greeting" Ng-non-bindable></span> span ng-non-bindable >{{greeting}}</ span> Write the article is not to write out to others to read to write, the study of their own record down, to learn to do a summary, so that they remember the deeper, you can come back to see, if anyone would like to see the words can also come to a communication, sharing the different understanding and experience.
Angular--Ngapp, Ngbind, ngbindhtml, ngnonbindable
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
