Question

我在页面上有一个选择下拉菜单。假设它有3个项目，橙色，香蕉，芒果。有一个按钮可以将新项目添加到列表中。考虑当前在下拉列表中选择橙色，当我点击添加新按钮并尝试添加一个新的水果项目时说桃子我看到的是桃子重复两次。现有的橙色现在也被桃子取代。我正在使用下面给出的Angular.copy，为什么会重复这个？水果列表来自服务器我在我的动作中有一个水果arraylist并解析为json以显示在页面上。

<select id="fruitSelect" ng-options="fruit.description for fruit in fruits" ng-model="selectedFruit" ng-change="fruitsClicked()"> </select>

我有一个按钮，点击此按钮会打开一个模态并要求用户提供一个名称以将水果保存到列表中。

<button type="button" ng-click="saveFruit()">Save</button>

JS控制器代码：

$scope.saveFruit= function() {
        var length = $scope.fruits.push({
          description: angular.copy($scope.form.newFruit)
         });
      $scope.selectedFruit= angular.copy($scope.fruits[length-1]);
    };

我想在下拉列表中选择新添加的水果，因此对于ng-model selectedFruit我将其设置为已保存搜索中最后一个水果的角度副本值。这工作正常，但它创建了一个副本。在我的情况下，它取代了以前用桃子选择的橙色。

Answer 1

我创建了一个JSfiddle https://github.com/docusign/DocuSign-.NET-Client我相信有答案。

您不需要在此案例中使用angular.copy。此函数主要用于复制javascript否则只复制指针的对象。

根据您提供的内容，我猜您可能会调用函数将水果添加到阵列两次，例如表单上的ng-submit和同一表单的提交按钮中的ng-click。

更新

更新了JSfiddle。更改所选选项时，您只需要传递给ng-model所选数组的索引。

角度副本在select中创建重复条目

1 个答案: