AngularJS为输入类型文件增加了更多选项

Question

假设我想在输入类型文件字段旁边添加' add More'按钮。这样，点击"添加更多"按钮，一个新的文件字段将被创建。

我可以在JQuery中使用'.clone()'。

但是在AngularJS中我怎么做呢?

谢谢! !

Answer 1

In controller:

$scope.addMore = function() {
    $scope.inputs += 1;
};
$scope.range = function(count) {
    var inputs = [];
    for (var i = 0; i < count; i++) { 
        inputs.push(i)
    }
    return inputs;
}
$scope.inputs = 0;

HTML:

<input ng-repeat="n in range(inputs)">
<button ng-click="addMore()">Add more!</button>

---

更实用的版本:

通常情况下，你想有其他信息相关的输入字段，但根据你的用例，你可能只是想有一个数组的输入对象与一些属性，然后ng重复数组，像这样:

控制器:

$scope.inputs = [];
$scope.addMore = function() {
    $scope.inputs.push({
        id: $scope.inputs.length,
        text: "Initial text here"
    })
};

HTML:

<input ng-repeat="input in inputs" ng-model="inputs[$index].text">
<button ng-click="addMore()">Add more!</button>

Answer 2

您要做的是创建一个输入按钮数组。

显示输入数组:

<div ng-repeat="item in items"><input type="text" ng-model="item.value"><div>

为按钮的ng-click附加一个函数:

<button ng-click="addMore()">Add More</button>

，然后在controller中定义数组:

$scope.items = [];
$scope.addMore = function () {
          $scope.items.push({ 
            value:'default'
          });