如何使用Angular JS在带有输入字段的文本框中添加文本并将其从文本框中删除？

Question

我创建了两种形式。 第一种是这样，我可以将许多类型的项提交到数组，以在第二种形式的文本框中显示。 第二个窗体中的文本框应在从第一个窗体中添加新项目时显示数组中的项目。 我希望能够删除文本框中的项目，并让它在保存之前从数组中删除项目。 我还想从数组中选择一个项目作为主要名称。 我在第二个表单中设置了一个输入框，用于选择主要名称。

下面的代码有两个问题：1）文本框不会添加新项，因为它们是从第一个表单键入或提交的。 2）如果我将信息放置在数据存储中，由于将其设置为可编辑表单，它将显示在我的文本框中，但是当我从文本框中删除信息时，它不会从我的数组中删除（至少从我的数组中删除）可以告诉）。 3）选择一个主要名称虽然有些奏效，但它有很多问题，而且似乎每尝试更改一次它的值就只能顺利进行一次。

我的印象是ng-bind（或ng-list？）可以通过模型的更改来协调DOM中的数据。 我要去哪里错了？ 我查看了一些在此问题上有用的链接，但无法将它们完全应用于当前任务：

https://docs.angularjs.org/api/ng/directive/ngBind
https://docs.angularjs.org/api/ng/directive/ngList
http://codepen.io/NicholasMurray/pen/ogmLyy
http://stackoverflow.com/questions/16125872/why-ng-bind-is-better-than-in-angular

我的HTML：

<form class="first-signup-inner-form" ng-submit="submit()">
<input list="names" ng-model="aliases" type="text" placeholder="Names">
<input type="submit" value="Submit">
</form>

<form class="first-signup-inner-form" editable-form name="editableForm">
<textarea class="w-input alias-text-field" id="Aliases" placeholder="All Names" name="Aliases" ng-bind="list"></textarea>
<input class="w-input business-name-text-field" list="aliases" ng-model="user.Name" id="Business-Name" type="text" placeholder="Official Name" name="Business-Name" required="required">
<datalist id="aliases"><option data-ng-repeat="alias in list" value="{{alias}}"></datalist>
</form>

JS：

$scope.list = [];
$scope.aliases = "";
$scope.submit = function(){
            if ($scope.aliases){
              $scope.list.push(this.aliases);
              $scope.aliases = "";
            }
          };

Answer 1

因此，这是你的问题的答案看这里