Question

我正在尝试理解ng-repeat中指令的范围，仍然想知道它是否来自ng-repeat，但它看起来像。这是我的代码

directive.js

myApp.directive('dirSample', function () {
  return {
    template: '<input type="text" ng-model="name" />',
    replace: true,
    restrict: 'AE'
  }
});

mainController.js

angular.controller('mainController',function($scope){
    $scope.name = 'name'
});

的index.htm

<div ng-repeat="i in [1, 2, 3, 4]">
   <dir-sample></dir-sample>
</div>

<dir-sample></dir-sample>
<dir-sample></dir-sample>

当我在最后两个指令中的一个（不在ng-repeat内）进行更改时，它运行良好，一个上的更改反映在另一个上。

问题：

1 - 如果我更改ng-repeat生成的指令的输入值，则更改不会反映在其他任何位置。 2 - 如果我改变最后两个指令之一的输入值，ng-repeat中的指令也会改变，但如果触摸（更改输入值）任何指令，更改将不会反映在该指令上但会继续反映在其他指令上。

有人可以解释为什么范围有这种行为吗？

感谢。

Answer 1

绑定原语非常棘手，如下所述：Understanding scopes。它必须与Javascript如何工作。你的名字＆＃39;变量将在ng-repeat块中更改后变为阴影。建议的修复（来自上面的链接）：

通过遵循以下内容，可以轻松避免使用原语这个问题＆＃34;最佳实践＆＃34;总是有一个＆＃39;。在您的ng模型中

他们还提供了一个视频链接，正好解释了这个问题：AngularJS MTV Meetup

所以修复如下：

app.controller('mainController',function($scope){
    $scope.attr= {}
    $scope.attr.name = 'name'
});

app.directive('dirSample', function () {
  return {
    template: '<input type="text" ng-model="attr.name" />',
    replace: true,
    restrict: 'AE'
  }
});

ng-repeat angularjs中指令的范围

1 个答案: