为什么 ng-click 在这个指令中只使用一个函数，而不是一个赋值？

Question

我正在尝试创建一个基于 objects 数组的 table，或者通过单击 headers 创建 table。我对排序功能的实现有疑问。

let myDirectiveTemplate = `
<table class="directiveTable">
  <thead>
    <th ng-repeat="(key,val) in tableObjectArray[0] track by $index">
      <a href="" ng-click="changeCriteria(key)">
        {{key}}
      </a>
    </th>
  </thead>
  <tbody>
    <tr ng-repeat="object in tableObjectArray | orderBy:criteria track by $index">
      <td ng-repeat="prop in object track by $index">
        {{prop}}
      </td>
    </tr>
  </tbody>
</table>
`

let app2 = angular.module('myDirectiveModule', []);

let myDirective = () => {
  return {
    restrict: 'E',
    scope: {
      tableObjectArray: '=objects',
    },
    controller: myDirectiveController,
    template: myDirectiveTemplate,
  }
};

let myDirectiveController = ($scope) => {
$scope.changeCriteria = criteria => {
  $scope.criteria = criteria;
}
};

app2.directive('myDirective', myDirective);
app2.controller('myDirectiveController', myDirectiveController);

这行得通。但是，如果在模板中我将 ng-click 更改为

ng-click="criteria = key"

好像什么都没做。即使只是用双花括号显示变量，它也不会在点击时改变。我之前在 ng-click 中使用过变量赋值；发生什么事了？

Answer 1

因为 ng-repeat 为每个项目创建了一个子作用域，所以您只能在该子作用域内更改基元。由于没有继承原语，因此控制器中的父范围保持不变

如果您要使用在控制器中声明的对象，或使用 ControllerAs 别名，由于继承，它可以正常工作

$scope.myModel ={criteria: 'defaultValue'}

ng-click="myModel.criteria = key"
<tr ng-repeat="object in tableObjectArray | orderBy:myModel.criteria track by $index">

从调试和测试的角度来看，通常首选使用函数

为什么 ng-click 在这个指令中只使用一个函数，而不是一个赋值？

Why is ng-click only working with a function, not an assignment, in this directive?

javascript

angularjs

angularjs-ng-click