我正在尝试使用 Angulars group-by 语法为表单数据创建下拉列表
[{name:'xyz', 子项:[{}...N]}...N](见下文)
http://plnkr.co/edit/Rthy3Bje7ISYVOSwzIZZ?p=preview
似乎 group-by 不支持这种结构，所以我只能在 optgroup 元素上使用 ng-repeat 。这使我不得不将所选项目视为字符串，然后必须将其解析回对象。
问题 1:Angular 的 group-by 语法可以在我的数据结构上工作以生成适当的 optgroups 吗？
如果没有，那么
问题 2:我当前使用 ng-repeater 而不是 optgroups 的实现是我必须用来解决此问题的基本风格还是我缺少更简单的解决方案？
<!DOCTYPE html>
<html>
<head>
<script data-require="angular.js@*" data-semver="1.3.0" src="//code.angularjs.org/1.3.0/angular.js"></script>
</head>
<body ng-controller="myCtrl">
<h3>Can select-group-by expression be used here????</h3>
<select ng-options="obj.name for obj in data" ng-model="selectedObj">
</select>
{{selectedObj}}
<h3>In lieu of repeating optgroups?</h3>
<select ng-model="selectedModel2" ng-change="convert()">
<optgroup ng-repeat="obj in data" label="{{obj.name}}">
<option value="{{bsnObj}}"
ng-repeat="bsnObj in obj.bsnObjs">{{bsnObj.name}}</option>
</optgroup>
</select>
{{selectedModel2}}
<script>
var app=angular.module("app",[]);
app.controller("myCtrl",function($scope){
$scope.convert=function(){
$scope.selectedModel2 = JSON.parse(this.selectedModel2);
};
$scope.data=[
{"name" : "forms", bsnObjs: [{name:"formA"},{name:"formB"}]},
{"name" : "docs", bsnObjs: [{name:"docsA"},{name:"docsB"}]}
]
});
angular.bootstrap(document,["app"]);
</script>
</body>
</html>
最佳答案
如果您有嵌套的对象数组(如下面的 json)，请使用下面的代码来展平列表:
$scope.data=[
{"name" : "forms", bsnObjs: [{name:"formA"},{name:"formB"}]},
{"name" : "docs", bsnObjs: [{name:"docsA"},{name:"docsB"}]}
];
var options = [];
for(indexKey1 in $scope.data) {
for(indexKey2 in $scope.data[indexKey1].bsnObjs) {
($scope.data[indexKey1].bsnObjs[indexKey2]).parent_name = $scope.data[indexKey1].name;
options.push($scope.data[indexKey1].bsnObjs[indexKey2]);
}
}
$scope.data = options;
console.log($scope.data); // your flatten list
现在使用:
<select ng-options="obj.name group by obj.parent_name for obj in data"></select>
关于javascript - 在对象数组上使用 Angular 的 group-by 表达式，每个对象都有一个嵌套数组，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/26514133/