我需要的是能够通过文本对选择元素的子选项节点进行排序，同时保持它们的值关联。我可以让他们按字母顺序排列并与他们的键解除关联，或者我可以在不按字母顺序排列的情况下关联他们的键。
我知道有一种直接访问 JSON 的方法，但这是一个分阶段的实现，该功能将在稍后推出。现在，我必须通过前置脚本块加载 json，直到MyInterface.js加载应用程序脚本。
我研究了自定义过滤器，但这就是与键分离的来源。如果 JSON 需要采用完全不同的格式，我愿意采用它。
这就是我所拥有的...
HTML
<!doctype html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.8/angular.min.js"></script>
</head>
<body>
<div ng-app="MyInterface" ng-controller="SimpleJSON">
<select name="index_category"
ng-model="IndexCategory"
ng-init="IndexCategory = IndexCategory || '0'"
ng-options="option in JSON.Categories | orderObjectBy:'val'">
<option value="0">Select Animal...</option>
</select>
</div>
<script>
var json = {
"123":"Zebra",
"456":"Monkey",
"789":"Anteater"
};
</script>
<script src="MyInterface.js"></script>
</body>
</html>
我的界面.js
(function(json) {
// AngularJS Module
var MyInterface = angular.module('MyInterface', []);
// Custom Filters
MyInterface.filter('orderObjectBy', function() {
return function(items, field, reverse) {
var filtered = [];
angular.forEach(items, function(item) {
filtered.push(item);
});
filtered.sort(function(a, b) {
return a[field] > b[field] ? 1 : -1;
});
if(reverse) filtered.reverse();
return filtered;
};
});
// Controllers
MyInterface.controller('SimpleJSON', function($scope) {
$scope.JSON = angular.fromJson(json);
});
})(json);
本质上，选择需要具有的选项是：
<option value="0">Select Animal...</option>
<option value="789">Anteater</option>
<option value="456">Monkey</option>
<option value="123">Zebra</option>
包含已接受答案的更改
HTML
<!doctype html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.8/angular.min.js"></script>
</head>
<body>
<div ng-app="MyInterface" ng-controller="SimpleJSON">
<select name="index_category"
ng-model="IndexCategory"
ng-options="option.value for option in JSON track by option.key">
<option value="">Select Animal...</option>
</select>
</div>
<script>
var json = [
{ key:"123", value:"Zebra" },
{ key:"456", value:"Monkey" },
{ key:"789", value:"Anteater" }
];
</script>
<script src="MyInterface.js"></script>
</body>
</html>
我的界面.js
(function(json) {
// AngularJS Module
var MyInterface = angular.module('MyInterface', []);
// Controllers
MyInterface.controller('SimpleJSON', function($scope, orderByFilter) {
// Load JSON
$scope.JSON = angular.fromJson(json);
// Alphabetize by Value
$scope.JSON = orderByFilter($scope.JSON, 'value');
});
})(json);