如何使用 Angular JS 增加或减少循环中重复的文本框值

Question

我有一个文本框：

<div class="container">
  <div ng-repeat="x in checkoutData">
   <img src="img/minus.jpg" ng-click="Decrement();">
   <input value="1"  type="text" ng-model="items[$index]"/>
    <img src="img/plus.jpg" ng-click="Increment($index);">
 </div>
 </div>

我的 angular 代码是：

$scope.Increment = function(index) {
   alert($scope.items[index]); // TypeError: Cannot read property '0' of undefined
};

因为文本框和图片重复。如果我点击特定图像，则只有特定文本框值必须递增，反之亦然。我如何使用 Angular JS.?

Answer 1

在您尝试递增计数器时，$scope.items 尚未初始化。在 Increment 函数中，添加一个 null/undefined 检查并将值设置为 0

  $scope.Increment = function(index) {
    if(!$scope.items[index]) {
      $scope.items[index] = 0;
    }
    $scope.items[index]++;
  };

Working Plunker

如何使用 Angular JS 增加或减少循环中重复的文本框值

How to increment or decrements the textbox value that is being repeated in loop using Angular JS

angularjs

angularjs-ng-repeat