一、AngularJS $parse 服务详解:解析字符串表达式
在 AngularJS 开发中,如果你需要将一个字符串表达式“运行”起来,并获取它对应的计算值,$parse 服务正是为此而生。它能够将表达式解析成一个可调用的函数,而该函数接收的上下文对象通常就是作用域($scope)。
更值得关注的是,通过 $parse 返回的处理函数,还附带了一个 .assign 属性。这个属性本身也是一个函数,专门用于在给定的上下文中修改表达式的值。换句话说,借助 $parse 你既能“读取”表达式结果,也能“写入”新值,实现双向操作。

来看一个典型的使用场景。假设你的 HTML 代码如下:
testing
然后在指令中这样编写:
app.directive('myDirective',function($log, $parse) {
return function(scope, elem, attrs) {
// 解析 "my-attr" 属性值,得到一个可调用的函数
var model = $parse(attrs.myAttr);
// model 现在是一个函数,调用它即可获取表达式在作用域中的值
// 下面这行代码会输出 scope 中 obj.name 的值
$log.log(model(scope));
elem.bind('click',function(){
// 'model.assign' 也是一个函数,用于更新表达式的值
model.assign(scope,'New name');
scope.$apply();
})
}
});
为什么这里必须使用 $parse?如果属性值只是一个简单的属性名,比如 "name",直接使用 scope[attrs.myAttr] 就能解决问题。但问题在于,这里的属性值是 "obj.name" 这种带路径的表达式——方括号语法根本无法解析这种嵌套结构。此时 $parse 的价值就完全体现出来了:它可以处理任意复杂度的 AngularJS 表达式,包括嵌套属性、过滤器运算等高级语法,极大提升了灵活性。
二、AngularJS $eval 服务:作用域内即时求值
$eval 是作用域($scope)自带的一个便捷方法,它的用法更加直接:在当前作用域下执行一个表达式,并立即返回结果。你无需手动传递上下文,因为上下文就是当前作用域本身。
scope.a = 1;
scope.b = 2;
scope.$eval('a+b'); // 返回 3
对比来看,$parse 是先将表达式“编译”成一个可复用的函数,你可以将它存储起来反复调用,非常适合在指令的链接函数中批量处理表达式;而 $eval 则属于即开即用的模式,适合在作用域内部的某个逻辑点临时计算数值。两者各有擅长的应用场景,但本质上都在做同一件事:将字符串形式的 AngularJS 表达式转化为可执行的代码,并获取结果。
