Question

http://plnkr.co/edit/NDTgTaTO1xT7bLS1FALN?p=preview

<button ng-click="addRow()">add row</button>

<div ng-repeat="row in rows">
<input type="text" placeholder="name"><input type="tel" placeholder="tel">
</div>

我想推新行并保存所有字段，但现在我不得不添加新行。如何知道当前的行数并按增量推入数组？

Answer 1

在控制器内移动功能＆＃39; Ctrl＆＃39;。

在你的剧本中：

function Ctrl($scope) {
    $scope.result = "something";
    $scope.rows = ['1'];

    $scope.addRow = function(){
        if ($scope.rows.length < 8) {
            $scope.rows.push($scope.rows.length + 1);
        }
    }

    $scope.saveAll = function(){
    //  $scope.result = 'something';
    }
}

Answer 2

查看我创建的这个示例，它允许您为Telephone和Text条目生成最多八个唯一输入字段。

var app = angular.module("MyApp", []);

app.controller("MyCtrl", function($scope) {
$scope.rows = [];
  
var Row = function(tel, text) {
  // Private data
  var private = {
    tel: tel,
    text: text
  }

  // Expose public API
  return {
    get: function( prop ) {
      if ( private.hasOwnProperty( prop ) ) {
        return private[ prop ];
      }
    }
  }
};

  $scope.addRow = function(){
    
    if($scope.rows.length < 8){
      var newItemNum = $scope.rows.length + 1;
      var row = new Row('item' + newItemNum, 'item' + newItemNum);
      
      $scope.rows.push(row);
    }
  };
  
  $scope.saveAll = function(){
  //  $scope.result = 'something';
  };

});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="MyApp">
<div ng-controller="MyCtrl">

      <h2>Setting</h2>
      <button ng-click="addRow()">Add Row</button>
      <br />
    
      <div ng-repeat="row in rows">
        <input type="text" placeholder="Text" ng-model="row.textModel" >
        <input type="tel" placeholder="Phone" ng-model="row.telModel" >
      </div>
    
      <br />
      {{rows}}
</div>
</div>

将增量项推送到Angularjs中的数组中

2 个答案: