如何使用anuglar js在按钮单击时创建动态输入字段？

Question

我有一个像这样的下拉菜单

[ShortAnswer-文本框，复选框，单选按钮和下拉列表] 用户可以选择输入类型，可以通过单击添加选项按钮添加选项

单击十字图标，需要删除选项。

我提到了dynamic text area

http://viralpatel.net/blogs/dynamic-add-textbox-input-button-radio-element-html-javascript/

但是我需要更多关于此的参考，请建议我使用角度js实现这一点。

Answer 1

从每个定义输入的对象数组构建输入列表。在按钮上单击，将新对象添加到定义要添加的输入的数组中。

HTML：

<div ng-repeat="input in inputsList">
  <span ng-click="remove($index)>x</span><input ng-if="input.type==='text'" type="text" />
  <span ng-click="remove($index)>x</span><input ng-if="input.type==='checkbox'" type="checkbox" />
  ...
</div>
<button ng-click="addNewCheckBox()">Add</button>

控制器：

$scope.addNewCheckBox = function() {
  $scope.inputsList.push({ type: 'checkbox' });
};

$scope.remove = function(index) {
   $scope.inputsList.splice(index, 1);
};

如果您有一个带有配置对象的自定义输入指令并且它将决定要构建哪个输入，那可能是最好的。但为了简单和清晰起见，我只使用了基本的原始html输入。

如果这有意义，或者您需要Angular2 / 4答案，请告诉我。