Angular 中的独特 ng-options
Unique ng-options in Angular
我试图在 select 框中的 angular ng-options 中获得独特的结果。
<select ng-model="nationality" id="nationality"
ng-options="player as player.nationality for player in players></select>
上面的代码会让我得到所有的国籍,但是它显示的是重复的。
<select ng-model="nationality" id="nationality"
ng-options="player as players | unique: 'player.nationality'"></select>
当我尝试此代码时 angular 抛出错误并且在 select 框中没有显示任何内容。
控制器
var app = angular.module('premierLeagueDB', []);
app.controller('mainCtrl', function($scope, $http) {
$http({
method : "GET",
url : "api.php/clubs",
}).then(function mySucces(response) {
$scope.clubs = response.data.club;
}, function myError(response) {
$scope.showError = response.statusText;
});
});
谢谢。
我认为这段代码对你有用:
<select ng-model="nationality" id="nationality" ng-options="player as players | unique: 'nationality' "></select>
===编辑===
基于您 html 文件中的 post , you need the third-party library to provide you the filter
service, include this library。
==编辑 2===
为了演示这是如何工作的,我做了一个 working fiddle。在这个 fiddle 中,我使用 anuglar-ui
库来替换模块并且它按预期工作。
如果你只需要 'ui.filters' 模块而不需要其他部分(只导入必要的模块是最好的做法),这里是 another fiddle link 只导入 unique
功能来自 ui-filter
模块。
我试图在 select 框中的 angular ng-options 中获得独特的结果。
<select ng-model="nationality" id="nationality"
ng-options="player as player.nationality for player in players></select>
上面的代码会让我得到所有的国籍,但是它显示的是重复的。
<select ng-model="nationality" id="nationality"
ng-options="player as players | unique: 'player.nationality'"></select>
当我尝试此代码时 angular 抛出错误并且在 select 框中没有显示任何内容。
控制器
var app = angular.module('premierLeagueDB', []);
app.controller('mainCtrl', function($scope, $http) {
$http({
method : "GET",
url : "api.php/clubs",
}).then(function mySucces(response) {
$scope.clubs = response.data.club;
}, function myError(response) {
$scope.showError = response.statusText;
});
});
谢谢。
我认为这段代码对你有用:
<select ng-model="nationality" id="nationality" ng-options="player as players | unique: 'nationality' "></select>
===编辑===
基于您 html 文件中的 post , you need the third-party library to provide you the filter
service, include this library。
==编辑 2===
为了演示这是如何工作的,我做了一个 working fiddle。在这个 fiddle 中,我使用 anuglar-ui
库来替换模块并且它按预期工作。
如果你只需要 'ui.filters' 模块而不需要其他部分(只导入必要的模块是最好的做法),这里是 another fiddle link 只导入 unique
功能来自 ui-filter
模块。