Question

我有这样简单的代码：

<div ng-app="app">
  <input type="text" ng-model="money" mask="2">
  <p>{{money}}</p>
</div>

angular.module("app", [])
  .directive("mask", function($parse) {
    return {
      restrict: "A",
      require: "ngModel",
      link: function(scope, element, attrs) {
        console.log($parse(attrs.mask)); // function(s, l, a, i){return 2;}
        console.log($parse(attrs.mask)(scope)); // 2
      }
    }
  });

为什么第一个输出为function(s, l, a, i){return 2;} (s, l, a, i)？

如果你需要JSFiddle：https://jsfiddle.net/ealonwang/x1hcbpjw/11/

Answer 1

根据Angular Documentation for the $parse service

$ parse（）没有使用scope作为IIEF调用，返回一个函数，这是一个评估的exssion，aka：return 2;

但是，返回的此函数需要多个参数：

功能（上下文，本地人）   一个表示编译表达式的函数：

context - {object} - 嵌入任何表达式的对象   在字符串中进行评估（通常是范围对象）。   locals - {object =} - 局部变量上下文对象，对于有用   覆盖上下文中的值。

返回的函数还具有以下属性：

literal - {boolean} - 表达式的顶级节点是否为a   JavaScript文字。 constant - {boolean} - 表达式是否为   完全由JavaScript常量文字构成。分配 -   {？function（context，value）} - 如果表达式是可赋值的，这个   将被设置为一个函数来改变它在给定上下文中的值。

所以你看到的是从服务返回的已评估但未立即调用的函数。

下面列出了针对此服务运行的测试用例，以解释如何使用和定义本地和上下文：

var getter = $parse('user.name');
var setter = getter.assign;
var context = {user:{name:'angular'}};
var locals = {user:{name:'local'}};

expect(getter(context)).toEqual('angular');
setter(context, 'newValue');
expect(context.user.name).toEqual('newValue');
expect(getter(context, locals)).toEqual('local');

具体来说，这些参数意味着什么： https://github.com/angular/angular.js/blob/master/src/ng/parse.js#L1934

var value = parsedExpression(scope, locals, assign, inputs);

Answer 2

如果你使用 $ parse（attrs.mask），它会返回掩码的getter函数。

当你使用 $ parse（attrs，mask）（范围）时，你在范围内调用了getter函数...

如果您使用 $ parse（attrs，mask）.assign（范围，'新值'），您将在范围内调用setter函数。

$ parse如何工作？

2 个答案: