浅谈AngularJS中之$parse和$eval

AngularJS的新家常常会针对$parse和$eval两独内建筑劳感到有些纳闷,今天我们不怕吧说AngularJS中之$parse和$eval。

总的来说,$parse和$eval都是打算于AngularJS的表达式。

哎是表达式?
AngularJS中的表达式就是片好像于JavaScript代码的代码有(但是其同JavaScript代码有不尽相同)。表达式通常给用来防范以绑定中,例如{{expression}}。下面是一个例证:

1 + 2 = {{ 1 + 2 }}
或者:

My name is {{ user.name }}
$parse服务
$parse服务得称一个表达式转换为一个函数。这个函数可以被调用,其中的参数是一个上下文对象,通常来说是作用域。

此外,通过$parse的表达式返回的此函数有一个assign属性。这个assign属性也是一个函数,它好据此来以给定的前后文中改变者表达式的价。

脚是一致截简单的代码:

<div my-attr="obj.name" my-directive>testing</div>

app.directive('myDirective',function($log,$parse){
    return function(scope,elem,attrs){
        //解析"my-attr属性值到一个函数中"
        var model = $parse(attrs.myAttr);
        //model现在是一个函数,可以调用它来获取表达式的值
        //下面这行代码将会输出作用域中obj.name的值
        $log.log(model(scope));

        elem.bind('click',function(){
            //'model.assign'也是一个函数,它用来更新表达式的值
            model.assign(scope,'New name');
            scope.$apply();
        })
    }
});

 

点的例证可以充分体现我们为什么要$parse服务。如果属性值是name,那么我们一齐可以绝不$parse,只所以scope[attrs.myAttr]即可。但是于点的事例中,方括号并无中用。

$eval服务
$eval是一个作用域scope中的计,它用会晤以眼前作用域中实践一个表达式并回结果:

scope.a = 1;
scope.b = 2;

scope.$eval(‘a+b’); // 3

相关文章