Question

我有一个简单的ng-repeat列表，其中我将当前列表项值分配给控制器上的另一个属性，如下所示：

  <li ng-repeat="num in list">
    <input type="text" ng-init="value = num" ng-model="value" />
    <button type="button" class="btn btn-primary" ng-click="save()">Save</button>
  </li>

但是当我点击“保存”按钮时，我会获得为$ scope.value设置的默认值。我希望显示特定输入文本的值。

这是控制器：

 angular.module('myApp', [])
    .controller('MyController', function($scope){
      $scope.value = false;
      $scope.list = [0, 1, 2, 3, 4];

      $scope.save = function() {
         alert($scope.value);
      }
    });

如何在保存函数调用中访问控制器中输入项的更新值。

以下是相同的plunker：plnkr

更新：我希望将值提取到控制器而不将其作为参数传递。

Answer 1

哇我不敢相信大多数人都错过了这个。如果您使用的是Angular 1.2，那么您一定要在ngRepeat指令中查看track by关键字。

<li ng-repeat="num in list track by $index">
    <input type="text" ng-model="list[$index]" />
    <button type="button" class="btn btn-primary" ng-click="save()">Save</button>
</li>

底线在绑定时远离原始类型，因为它会给你同步问题。

Fellas请花更多的时间和精力研究您的解决方案，而不是仅仅发布积分。

希望这有帮助！

Answer 2

ngRepeat创建一个范围，因此，对象通过引用传递并按值传递。您的代码存在问题，如果您成功更新了该值，它将更新ng-repeat中的所有数字。你可以这样做：

<强> HTML

    {{value.val}} <!-- for check the value -->
<li ng-repeat="num in list">
    <input type="text" ng-model="num" />
    <button type="button" class="btn btn-primary" ng-click="value.val=num">Save</button>
  </li>

<强>的javascript

angular.module('myApp', [])
    .controller('MyController', function($scope){
      $scope.value = {val:false};
      $scope.list = [0,1,2,3,4];
});

http://jsfiddle.net/oq6zdeLd/

对不起我的英语......

Answer 3

这就是你如何做到这一点

<li ng-repeat="num in list">
    <input type="text" ng-init="value = num" ng-model="value" />
    <button type="button" class="btn btn-primary" ng-click="save(value)">Save</button>
  </li>


angular.module('myApp', [])
    .controller('MyController', function($scope){
      $scope.value = false;
      $scope.list = [0, 1, 2, 3, 4];

      $scope.save = function(argument) {
         $scope.value = argument;
         alert($scope.value);
      }
    });

Answer 4

不要滥用表达“2 way binding”;）

您的控制器有一个范围，该范围内只有一个$scope.value。你不能强迫同时拥有多个值。

ng-repeat为每个li创建新范围。即使您尝试使用$parent.value，您的控制器的$scope.value也只会在ng-init

中分配最后一个值

在这种情况下，最好将该值作为参数传递。希望这有助于更多地解释这个问题。如果我错了，请纠正我。

双向绑定不与ng-repeat一起使用

4 个答案: