如何在按钮单击时在 angularjs 中动态添加输入字段？

Question

我正在尝试制作一个简单的示例，其中每次用户单击按钮时都会出现输入字段和按钮字段。

当单击与输入字段一起出现的新按钮时，如何获取输入字段的文本？

http://codepen.io/anon/pen/yNLGzx

var app = angular.module('ionicApp',['ionic']);
app.controller('cntr',function($scope){
     $scope.addfield=function(){
       alert("how to add input field dyanmically")
     }

})

我不知道该怎么做；在 jQuery 中我们可以使用 append 函数，就像这样

$('.addcontend').append('<input \> <button>get input value</button>')

如何使用 angularjs 实现这一点？

Answer 1

你可以做的是使用一个数组来表示输入，然后循环遍历数组并渲染它

<div class="addcontend">
  <div ng-repeat="item in inputs">
    <input ng-model="item.value"/> <button ng-click='addfield()'>get input value</button>
  </div>
</div>

然后

  $scope.inputs = [];
  $scope.addfield=function(){
    $scope.inputs.push({})
  }

演示：CodePen