Angular-Formly：在用户单击时动态添加表单字段

Question

我将如何在表单中添加功能，以便用户可以通过单击“添加”来添加更多输入字段。这使用了角度正式库。

这是确切功能的示例，但仅使用angularjs完成。

Answer 1

看到这个柱塞这是您所需要的示例。正如您在插件中看到的那样，TextArea单击按钮时可以动态创建一个。单击按钮TextAreas也可以删除创建的内容remove。请参阅下面的HTML<div class="col-sm-10">&nbsp; <input type="button" class="btn btn-info" ng-click="addNewChoice()" value="ADD QUESTION">&nbsp; <div class="col-sm-4">&nbsp; &nbsp; <fieldset data-ng-repeat="field in choiceSet.choices track by $index">&nbsp; &nbsp; &nbsp; <textarea rows="4" cols="50" ng-model=" choiceSet.choices[$index]"></textarea>&nbsp; &nbsp; &nbsp; <button type="button" class="btn btn-default btn-sm" ng-click="removeChoice($index)">&nbsp; &nbsp; &nbsp; &nbsp; <span class="glyphicon glyphicon-minus"></span> REMOVE&nbsp; &nbsp; &nbsp; </button>&nbsp; &nbsp; </fieldset>&nbsp; </div></div>和JS将如下var app = angular.module('myApp', []);app.controller('inspectionController', function($scope, $http) {&nbsp; $scope.choiceSet = {&nbsp; &nbsp; choices: []&nbsp; };&nbsp; $scope.quest = {};&nbsp; $scope.choiceSet.choices = [];&nbsp; $scope.addNewChoice = function() {&nbsp; &nbsp; $scope.choiceSet.choices.push('');&nbsp; };&nbsp; $scope.removeChoice = function(z) {&nbsp; &nbsp; $scope.choiceSet.choices.splice(z, 1);&nbsp; };});