添加行AngularJS

Question

功能：

＆＃13;

＆＃13;

angular.module('formTerm', [])
  .controller('MainController', ['$scope',
      function($scope) {

        $scope.rows = [{
          explanation: '',
          example: ''
        }];
        $scope.counter = 5;
        $scope.addRow = function() {
          $scope.rows.push({
            explanation: '',
            example: ''
          });
          $scope.counter++;
        }

＆＃13;

＆＃13;

＆＃13;

HTML：

＆＃13;

＆＃13;

<span class="add btn btn-primary" ng-click="addRow()">Add</span>
<div class="template term-row" ng-repeat="rows in rows">
  <div class="col-md-4">
    <textarea class="form-control" rows="2" id="explanation" placeholder="Explanation" name="explanation" ng-model="formData.rows.explanation"></textarea>
  </div>
  <div class="col-md-4">
    <textarea class="form-control" rows="2" id="example" placeholder="Example" name="example" ng-model="formData.rows.example"></textarea>
  </div>
  <div class="clearfix"></div>
  <br />
</div>

＆＃13;

＆＃13;

＆＃13;

有人请帮忙。行已添加，但我希望它在不同的元素名称中，例如＆＃34;解释1 @ explanation2 @ explanation3＆＃34;等

请查看the sample

Answer 1

您已将输入模型分配给变量formData.rows.explanation和formData.rows.example - 因此只需将它们作为值。

这应该可以解决问题：

$scope.counter = 5;
$scope.addRow = function() {
    $scope.rows.push({
        explanation: $scope.formData.rows.explanation,
        example: $scope.formData.rows.example
    });
    $scope.counter++;
}

Answer 2

使用$index，因为$ index将从0开始，我们需要为其添加+1。

<textarea class="form-control" rows="2" id="explanation{{$index + 1}}" placeholder="Explanation" name="explanation{{$index + 1}}" ng-model="formData.rows.explanation"></textarea>