角度下拉选项添加选项获取数据

Question

我一直在环顾世界相当一段时间，但没有一个甚至远程关闭的问题，我似乎包含这个答案。

情况如下：

我使用AngularJS填充下拉（或选择，如你所愿）（^ 1.6.2）从数据库中读取数据。这个数据放在这个选择使用ng-options与一切正确设置和所有。

我试图做到的，是一个NULL选项被添加到此选项列表，但不包含所获取的数据$scope对象。

我会用一些代码澄清：

<select ng-options="item as item.name for item in items track by item.id" 
     ng-model="forms.formDataObject.item"> 
</select> 

这会产生一个选项列表，像这样：

<select ...> 
    <option value="1">Item 1</option> 
    <option value="2">Item 2</option> 
    <option value="3">Item 3</option> 
    ... 
</select> 

我试着用NULL选项添加到这个下拉以下Angular过滤器：

app.filter('addNullOption',() => { 
    return (input) => { 
     if (!input[0].null_option) { 
      var emptyObj = angular.copy(input[0]); 

      Object.keys(emptyObj).forEach((key) => { 
       emptyObj[key] = null; 
      }); 

      emptyObj.null_option = true; 

      input.unshift(emptyObj); 
     } 
     return input; 
    }; 
}) 

然后在中应用过滤器与其他过滤器一样。

此方法有效，但将NULL选项添加到$scope对象，而不是仅在此下拉列表的$scope中可用。我不希望发生这种情况，因为整个应用程序中的其他下拉列表使用相同的$scope对象来填充下拉列表，并且它们应该不是有此NULL选项可用。

概括地说，这是我的问题：我想能到NULL选项添加到预填充下拉列表中，仅在特定下拉的$scope。

任何人都可以引导我在正确的方向吗？

Answer 1

而不是将过滤器数据分配给相同的数组。将其分配给不同的阵列。这样原始数组将保持不变。

<select ng-options="item as item.name for item in sampleAr = (items | filter : addNullOption) track by item.id" 
     ng-model="forms.formDataObject.item"> 
</select> 

这可能不是最好的方法来做到这一点，但我多次碰头，但这是我唯一的解决方案。希望这有助于

angular.module("app",[]) 
 
.controller("ctrl",function($scope){ 
 
$scope.items = [{"id":1,"name":"sss","null_option":true},{"id":2,"name":"aaa"},{"id":3,"name":"fff"},{"id":4,"name":"asdas"}] 
 
$scope.sampleAr = angular.copy($scope.items) 
 

 

 
$scope.addNullOption =()=>{ 
 
return (input) => { 
 
     if (input.null_option) { 
 
      $scope.items.splice(input,1) 
 
     } 
 
     return input; 
 
    }; 
 
} 
 

 
$scope.copys = function (item){ 
 
    return angular.copy(item); 
 
} 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="app" ng-controller="ctrl"> 
 
<select ng-init="sampleAr = copys(items)" 
 
ng-options="item as item.name for item in sampleAr track by item.id" 
 
     ng-model="forms.formDataObject.item"> 
 
</select> 
 
<div ng-init="items = items | filter :addNullOption() "> </div> 
 
<br> 
 
{{items}} 
 
<br> 
 
<br> 
 
{{sampleAr}} 
 
</div>