First look at the official api about $ parse the
$ parse
role: to convert a AngularJS expression as a function
Usage
$ parse (expression The)
arguments The
expression The: AngularJS statement needs to be compiled
returnsfunc (context, about locals)
context [Object]: for you to parse the statement, this object contains the expression you want to parse the statement (usually a Object scope)
about locals [Object]: About the local variables of context variables, for covering the context of the value of the variable is useful.
Function has returned the following three characteristics:
literal [Boolean]: expression is the highest node is a javascript literal
constant [boolean]: constant expression is entirely of a composition literal javascript
assign [func (context, local )]: may be used to modify the value of the expression in a given context
simply: $ the parse a service may be converted to a function expression. This function can be called, wherein the parameter is a context object, is usually scope.
In addition, the return of $ parse through the expression of this function has an assign property. This property is also assign a function that can be used to change the value of the expression in a given context.
Try to apply this service
T1: In the first example, let's parse a simple expression:
code is as follows:
<div = ng-App "the MyApp">
<div = ng-Controller "MyController by">
<h1 of> ParsedValue {{}} </ h1 of>
</ div>
</ div>
angular.module ( "the MyApp", [] )
.controller ( "MyController", function ($ scope, the parse $) {
var context = {
name: "dreamapple"
};
// this resolution because the statement contains an expression we want to parse,
// so should irrelevant in quotation marks, followed by the entire connection +
var = expression the " 'the Hello' name +";
var = $ and parseFunc the parse (expression the);
$ = scope.ParsedValue and parseFunc (context);
});
expression the: we expressions want to parse
context: that is, an analytic expression of context (personal understanding)
parseFunc:Is the function to parse the returned later
we can take a look at the properties returned by the function of the console:
angular.module ( "MyApp", [])
.controller ( "MyController", function ($ scope, the parse $) {
var context = {
name: "dreamapple"
};
// this resolution because the statement contains an expression we want to parse,
// so should not associated with quotation marks, followed by the entire connection +
var = expression the " 'the Hello' name +";
var = $ and parseFunc the parse (expression the);
// to false
the console.log (parseFunc.literal);
// to false
the console.log (parseFunc.constant);
// undefined
the console.log (parseFunc.assign);
// Hello
the console.log (and parseFunc ());
// function (Self, about locals) {
// return Fn (Self, about locals, left, right);
//}
the console.log (and parseFunc);
parseFunc scope.ParsedValue = $ (context);
});
We know from the console, a function is returned parseFunc, wherein the literal and its attributes are constant false, and parseFunc () function returns no added execution context the value that is "Hello".
T2: In a second example, we use again the parse $ service to parse a value input box:
<div = ng-App "the MyApp">
<div = ng-Controller "MyController by">
<INPUT type = "text" = ng-Model "expression The" />
<div> ParsedValue {{}} </ div>
</ div>
</ div>
angular.module ( "the MyApp", [])
.controller ( "MyController by", function ($ scope, the parse $) {
$ scope. $ Watch ( "expression The", function (newValue, oldValue, context) {
IF (newValue!
We use the change $ watch monitoring input input box, whenever the value of the expression input box changes, we will resolve it, we can try to input box, enter "1 + 1", and then you will see 2 is shown below.
T3: we compare the depth used in the third example, the parse service $
<div = ng-App "the MyApp">
<div = ng-Controller "MyController by">
<div> ParsedValue {{}} </ div>
< / div>
</ div>
angular.module ( "the MyApp", [])
.controller ( "MyController by", function ($ scope, the parse $) {
$ = {scope.context
the Add: function (A, B) {return B + A;},
MUL: function (A, B) * B} A {return
}
$ scope.expression = "MUL (A, the Add (B, C))";
$ scope.data = {
A:. 3,
B:. 6,
C:
and parseFunc the parse $ = var ($ scope.expression);
elem.bind ( 'the Click', function () {
and parseFunc scope.ParsedValue = $ ($ scope.context, $ scope.data);
});
We can see that the result is 45, we can generally understood, the parse service resolving $ $ scope according to the context provided $ scope.context .expression statement, and then use the data to populate $ scope.data variables in the expression Note that if the $ scope.expression replaced in c 4, then the result is 30, so get 45 results.
T4: The fourth example is to use the parse $ service access and modify the values of custom properties in the instruction:
<div My-attr = "obj.name" My-Directive> Testing </ div>
app.directive ( 'myDirective', function ($ log, the parse $) {
return function (scope, elem, attrs) {
// parse "my-attr attribute values into a function"
var = $ Model the parse (attrs.myAttr);
// Model is now a function that can be called to get the value of the expression
// this line of code will obj.name scope output value
$ log.log (Model (scope));
//'model.assign 'is a function that is used to update the value of the expression
model.assign (scope,' New name ');
scope Apply $ ();.
})
}
});
The above example can be sufficiently embodied Why do we need $ parse service. If the property value is the name, so we can not have $ parse, only the scope [attrs.myAttr] can be. However, in the above example, the square brackets are not useful.
Transfer: HTTP: //blog.csdn.net/feiying008/article/details/50222829
https://www.cnblogs.com/xujie520/p/5640850.html
stock "three not to sell seven do not buy" 6 Golden word formulas, only buy shares of blowout win millions of net worth!
Compass information • Ting Hsin
want to say something of
Talking AngularJS of $ parse this service allows you to understand
reading the number of 4118
first look at the role of official api $ parse about $ parse of: converting a AngularJS expression into a function usage $ parse (expression) argumentsexpression: An ... needs to be compiled
Bowen
from: Eagle columns of
usage demo angular.js $ parse the
number 638 reading
"angular authoritative guide" in the $ parse usage Page20 page to a demo, does not work out the correct result, background nor do after being given the following changes, can run correctly, but we can not determine their use is correct. Tell me what you are for reference ...
Bowen
from: Lambert0320 the blog
within angular.js ng-repeat method parameters question $ parse: syntax
read the number 753
as shown, has a background role in the management module to develop a project, you need to traverse all user roles, and click edit event to add user roles, event parameters for user roles ID but console will log out during the operation of such a mistake after reading angularjs official ...
Bowen
from: itkfdektxa's blog
angularjs-1.3 code is learning - $ parse
the number of reading 239
this time we look at the SandboxingAngularExpressions angular. About built-in method, the core has two: Lexer and Parser. $ Parse which everyone may know more about that. Well ado, look at the ...
Bowen
from: liuyu5210 the blog
$ .parser.parse ()
Reads 4048
in some JavaScript dom element is easui style stitching on the dynamic, because the page has rendered, so You need to manually perform the rendering of a part or the whole page $ .parser.parse (); // render all pages $ .parser ....
Bowen
from: Thinkingcao's blog
angularJS common error
Reads 569
Error: [ng: AREQ] can not find the corresponding ctrlError: [$ injector: unpr] module fails to properly inject Error: [ngModel: nonassign] ng-model is not the right expression Erro .. .
Bowen
from: miniminixu's blog
AngularJS common error summary