如何使用 AngularJS 添加动态文本字段答案

【问题标题】：How to add dynamic text fields with AngularJS如何使用 AngularJS 添加动态文本字段
【发布时间】：2014-05-21 15:03:47
【问题描述】：

我的问题更多是关于在这种情况下的最佳做法是什么：

我有一个表单，它必须允许用户输入 n 个想法，每个想法都在一个独立的文本字段中。理想情况下，最后一个文本输入旁边会有几个按钮，以允许用户创建新的文本输入或删除最新的文本输入。

我知道 DOM 操作不是使用 Angular 的方式，但由于需求，我必须做一些需要动态创建元素的事情。 Angular 中是否有最佳实践、服务或指令可以让我这样做，或者我应该只用 jQuery 注入元素？

【问题讨论】：

Binding ng-model inside ng-repeat loop in AngularJS 的可能重复项

标签： angularjs

【解决方案1】：

您唯一需要的是正确使用 ng-repeat。不需要使用 jQuery 进行 DOM 操作。这也不是好的做法。看，ng-repeat 的力量。

工作的笨蛋here.

【讨论】：

【解决方案2】：

这样的？

<div ng-repeat="idea in ideas">
    <input ng-model="idea">
</div>
<button ng-click="AddNew()">Add New Idea</button>
<button ng-click="DeleteLast()">Delete Last Idea</button>

在控制器中：

$scope.AddNew = function() {
    $scope.ideas.push("");
}

$scope.DeleteLast= function() {
    $scope.ideas.splice($scope.ideas.length-1, 1);
}

【讨论】：