如何添加过滤器 <select>无<ng-options>在Angular JS中？

Question

I have a select statement 我有一条选择声明

<select ng-model="selectedItem" ng-change="onChange()">
        <option id="{{item.toLowerCase()}}" ng-repeat="item in someArray">{{item}}</option>
    </select>

and want to apply a filter on the options to show a different value in the dropdown. 并希望在选项上应用过滤器以在下拉列表中显示其他值。 Any ideas? 有任何想法吗？

When using ng-options it was easy (see below), but now I can't seem to get it working. 使用ng-options时很容易（请参阅下文），但是现在看来似乎无法正常工作。

<select
ng-options="item as (item | filterThatIWant) for item in someArray
ng-model="selectedItem"
ng-change="onChange()>
</select>

Basically I just need the equivalent of the above. 基本上，我只需要以上所述。 without the ng-options. 没有ng-options。

Thanks 谢谢

Answer 1

Its the same as ng-option 与ng-option相同

<select ng-model="selectedItem" ng-change="onChange()">
    <option id="{{item.toLowerCase()}}" ng-repeat="item in someArray | filterThatIWant">{{item}}</option>
</select>

Answer 2

You can use ng-repeat for options, 您可以使用ng-repeat作为选项，

<select ng-model="selectedItem" ng-change="onChange()">
    <option id="{{item.toLowerCase()}}" ng-repeat="item in someArray">{{item | filterThatIWant}}</option>
</select>

 <!DOCTYPE html> <html> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> <body> <select ng-app="myApp" ng-controller="namesCtrl"ng-model="selectedItem" ng-change="onChange()"> <option id="{{item.toLowerCase()}}" ng-repeat="item in names">{{item | myFilter}}</option> </select> <script> var app = angular.module('myApp', []); app.filter('myFilter', function() { return function(x) { var i, c, txt = ""; for (i = 0; i < x.length; i++) { c = x[i]; if (i % 2 == 0) { c = c.toUpperCase(); } txt += c; } return txt; }; }); app.controller('namesCtrl', function($scope) { $scope.names = [ 'Jani', 'Carl', 'Margareth', 'Hege', 'Joe', 'Gustav', 'Birgit', 'Mary', 'Kai' ]; }); </script> <p>This filter, called "myFilter", will uppercase every ODD character.</p> </body> </html>

PLease run the above snippet 请运行上面的代码片段

Here is a WORKING DEMO 这是一个工作演示

如何添加过滤器 <select>无<ng-options>在Angular JS中？

问题描述

2 个解决方案

解决方案1
0 已采纳 2017-05-15 11:20:10

解决方案2
0 2017-05-15 11:39:50

如何添加过滤器 <select>无<ng-options>在Angular JS中？

问题描述

2 个解决方案

解决方案1 0 已采纳 2017-05-15 11:20:10

解决方案2 0 2017-05-15 11:39:50

解决方案1
0 已采纳 2017-05-15 11:20:10

解决方案2
0 2017-05-15 11:39:50