Angular 学习系列 - - $interpolate 和 $parse
$interpolate
将一个字符串编译成一个插值函数。HTML编译服务使用这个服务完成数据绑定。
使用:$interpolate(text,[mustHaveExpression],[trustedContext],[allOrNothing]);
text:需要被编译的字符串。
mustHaveExpression:boolean,如果为true,那么text必须含有嵌入其中的表达式,不然将会返回null,而不是预期的interpolate function,默认为false。
trustedContext:string,如果这个参数被提供,那么在返回相应的函数之前会使用$sce.getTrusted(interpolatedResult, trustedContext)对返回的结果做处理。
$interpolate带有一个可选的第四个参数,allOrNothing。如果allOrNothing为true,插值函数将会返回未定义除非所有嵌入表达式的计算结果不为undefined。
使用代码:
{{ctrl.value}}
(function(){angular.module('Demo', []).controller('testCtrl',["$interpolate","$scope",testCtrl]); function testCtrl($interpolate,$scope) {var vm = this;var obj = { value: "Hello" };vm.text = "World";$scope.$watch("ctrl.text",function(n,o){ var interpolate = $interpolate("{{value}} " + n);vm.value = interpolate(obj);})}}());
$parse
将Angular表达式转换为函数。
使用:$parse(expression);
expression:被编译的表达式。
返回:表示表达式编译后的函数。function(context,locals)
context:对象,含有需要解析的语句中的表达式(通常是一个scope对象)。
locals:对象,局部变量的上下文对象,用于重写上下文中的值。
属性:
literal:boolean,表达式的顶节点是否是一个javascript字面量。
constant:boolean, 表达式是否全部是由javascript的常量字面量组成。
assign:function(context,locals),可以用来在给定的上下文中修改表达式的值。
使用代码:
{{ctrl.ParsedValue}}
(function(){angular.module('Demo', []).controller('testCtrl',["$parse",testCtrl]); function testCtrl($parse) { var context = {add: function (a, b) { return a + b; },mul: function (a, b) { return a * b }}; var data = {a: 2, b: 3, c: 4}; this.value = context.mul(data.a,context.add(data.b,data.c));// 平常的函数嵌套调用 2*(3+4) = 14 var expression = "mul(a, add(b, c))";// 表达式,将被转换为函数 this.ParsedValue = $parse(expression)(context, data); //执行上一句的函数 2*(3+4) = 14 }}());
转载于:https://my.oschina.net/yeshou/blog/615008
本文来自互联网用户投稿,文章观点仅代表作者本人,不代表本站立场,不承担相关法律责任。如若转载,请注明出处。 如若内容造成侵权/违法违规/事实不符,请点击【内容举报】进行投诉反馈!