AngularJS 表达式中的 $locals 是什么？答案

【问题标题】：What are $locals in AngularJS expressions?AngularJS 表达式中的 $locals 是什么？
【发布时间】：2016-01-26 16:22:16
【问题描述】：

AngularJS Developer Guide on Expressions 提到了一个名为 $locals 的东西：

可以使用标识符 this 访问上下文对象，使用标识符 $locals 访问本地对象。

我不明白什么是“locals 对象”，我在文档中找不到更多关于 $locals 的信息。它的目的是什么？你如何操作它？

【问题讨论】：

标签： angularjs

【解决方案1】：

在哪里可以找到有关它的更多信息的相关提交是this one，它还链接到要求引入 $locals 的问题。

简而言之，当使用 '&' 将参数传递给指令时，为了让指令能够在需要时执行某些代码（例如，当您使用 ng-click="doSomething()" 时），指令可以将信息传递给调用者使用本地值。

例如可以使用ng-click="doSomething($event)"，其中$event不是作用域的属性，而是ng-click指令传递的值。

您可以使用$locals 一次访问所有这些值，而不是单独访问指令传递的每个“本地”值。

documentation on directives 中提供了有关如何从指令传递本地值的更多信息：

& 或 &attr - 提供一种在父作用域的上下文中执行表达式的方法。如果未指定 attr 名称，则假定属性名称与本地名称相同。给定范围的小部件定义：{ localFn:'&myAttr' }，然后隔离范围属性 localFn 将指向 count = count + value 表达式的函数包装器。通常希望通过表达式将数据从隔离范围传递到父范围，这可以通过将局部变量名称和值的映射传递到表达式包装器 fn 来完成。 例如，如果表达式是increment(amount)，那么我们可以通过调用 localFn 来指定金额值 localFn({amount: 22})

（强调我的）

在上面的示例中，指令传递的整个对象{amount: 22} 可以使用$locals 获得，因此您可以使用increment($locals.amount)

【讨论】：

【解决方案2】：

See this test 描述来自Issue 13247 的功能。

同时考虑这个带有回调的指令示例：

// JS
angular.module('app', [])
.controller('AppCtrl', function($scope) {
  $scope.log = function(locals) {
    console.log(locals);
  };
})
.component('fooBar', {
  template: "",
  bindings: { cb: '&'},
  controller: function() {
    this.a = 1;
    this.b = 2;
    this.c = 3;
    this.cb(this);
  }
});

// HTML
<body ng-app="app" ng-controller="AppCtrl">
   <foo-bar cb="log($locals)">foobar</foo-bar>
</body>

【讨论】：

那么这个日志是什么？
它记录控制器返回的内容。 { a: 1, b: 2, c: 3, cb: function (locals){...} }