Question

谢谢大家。我现在将选择一个详细的答案并将其关闭。

请参阅下面的代码，它相当直接

<tr ng-repeat="record in records track by record.id">
  <td><input type="checkbox"/></td>
  <td ng-repeat="(name, value) in record" ng-hide="name == 'id'">
    <portia-td value="{{value}}"></portia-td>
  </td>
</tr>

这是指令定义

return {
  restrict: 'E',
  replace: true,
  transclude: true, 
  scope: {
    value: '=' 
  },

  controller: function($scope) {
    $scope.input = {show: false, value: $scope.value};
  },
  templateUrl: "td.html"
  }

为什么这会产生错误？但是当将范围更改回＆＃39; @＆＃39;时，它会再次起作用。

Answer 1

如果您想要双向数据绑定，则需要使用=。像这样：

scope: {
  value: '=' 
}

在HTML上：

<portia-td value="value"></portia-td>

使用"{{value}}"时，基本上是插入value属性的值并将其传递给指令。这意味着angular将无法获得创建双向绑定的引用，它将获得的是一个值（字符串/数字/等...）。

更多信息here。

Answer 2

如果需要在指令范围之外更改模型，则必须使用getter-setter模型选项。检查以下链接，有一个示例直接在范围外的控制器中更新值。

https://docs.angularjs.org/api/ng/directive/ngModelOptions

Answer 3

在将值传递给指令时不要使用{{value}}，这样就可以传递引用并且它是双向的。

这里有完整的plnkr示例：http://plnkr.co/edit/rvY9A0DOEZpOEwOoy3xN?p=preview

<portia-td value="value"></portia-td>

Angular双向数据绑定无法正常工作

3 个答案: