Question

我有一些字段（选择和输入文字）。用户可以单击“添加”按钮添加新行。但是，如果我想用输入克隆填充的数组怎么办？

我的意思是：我选择3°，然后我在第一个输入类型中写入'55'，在第二个输入类型中写'9'。如果用户按“添加”，我如何用我写的数字复制字段？

<button data-ng-click="cloneItem()" class="btn inline">
 Add
</button>

Answer 1

您需要在ng-repeat中添加添加按钮，然后将输入的食物对象传递给cloneItem函数。然后你可以在该函数中克隆该项目。使用angular copy函数制作食物对象的副本。

代码：

更改了控制器范围功能：

$scope.cloneItem = function (food) {
   var itemToClone = angular.copy(food);
   $scope.foods.push(itemToClone);
}

更改了HTML（ng-repeat循环）：

<div ng-controller="ProductController">

      <div data-ng-repeat="food in foods track by $index">
        <div class="form-group title-field">
          <select  ng-model="food.selectproduct" >
            <option value="1">0101003 - Min. Diet pesce 2 Scd</option>
            <option value="2">0101004 - Min. Maint pesce 4 Scm</option>
            <option value="3">0101115 - Min. Diet pesce 1.5 Scd</option>
          </select>
          <input type="hidden">
          <button data-ng-click="removeItem($index)" class="btn delete-field-{{$index}}">
            Delete
          </button>
        </div>

        <div class="form-group">
            <label> QUANTITY 1 </label>
            <input type="text" class="form-control" data-ng-model="food.Quantity1" id="barcodeValue1" >
        </div>

        <div class="form-group">
            <label> QUANTITY 2 </label>
            <input type="text" class="form-control" data-ng-model="food.Quantity2" id="barcodeValue2">
        </div>

        <div class="ean">
          <h2> CODE: </h2>
          <barcode food="food"></barcode>
        </div>
        {{food | json}}
        <button data-ng-click="cloneItem(food)" class="btn inline">
        Add
      </button>
      </div>

Working Plunkr

Answer 2

假设您想在单击添加按钮时复制上一个块的值，您可以这样做：

$scope.cloneItem = function() {
  var food = $scope.foods[$scope.foods.length - 1];
  var itemToClone = {
    "selectproduct": food.selectproduct,
    "Quantity1": food.Quantity1,
    "Quantity2": food.Quantity2
  };
  $scope.foods.push(itemToClone);
}

使用输入文本Angular克隆对象

2 个答案: