Angular JS形式：ng-options和复杂的选项操作

Question

我在使用几个不同的选择框时遇到了麻烦。

---

第1期

首先是一个框，其中列出了按“处于状态”或“处于状态外”分组的物理位置。 我对它们进行了分组，并且值和标签按照我想要的方式进行了设置，但是我无法获得分组的选项来按字母顺序排序。 我已经尝试过orderBy：'name'和其他似乎适用于其他所有人的解决方案。

我的html看起来像这样：

<select name="dealer" id="dealer" ng-model="warrantyReg.dealer" ng-options="dealer as dealer.selectLabel group by dealer.for for dealer in dealers track by dealer.selectValue | orderBy:'selectLabel'">

我的经销商列表中的一些示例：

$scope.dealers = [
    {selectLabel:"Location A", selectValue:255, for:"In state"},
    {selectLabel:"Location C", selectValue:1, for:"In state"},
    {selectLabel:"Location B", selectValue:5, for:"In state"},
    {selectLabel:"Location Z", selectValue:25, for:"Out of state"},
    {selectLabel:"Location X", selectValue:55, for:"Out of state"},
    {selectLabel:"Location Y", selectValue:50, for:"Out of state"}
];

（请注意，这是对象的简化版本，它们包含的信息比我在此处显示的要多得多。）

无论我做什么，都不会通过selectLabel对选项进行排序。 我也尝试过orderBy：'dealer.selectLabel'，它也没有做任何事情。

更新我忘了提到$ scope.dealers是由angular.forEach（）在服务返回的数据上构建的。 我遍历每个返回的经销商，并通过连接名称和位置键来创建selectLabel，然后将该值推入$ scope.dealers数组。

在$ scope.dealers上使用.sort（）不会执行任何操作。 但是，如果我在通过angular.forEach（）传递服务之前对服务返回的数据使用.sort（），则会对它们进行排序。 我不确定有什么区别，但这至少是一种解决方案，也是我现在正在做的事情。

---

第2期

我想要一个带有“其他...”选项的选择框，在选择该框时提供一个文本字段。 我已经在那部分工作了，但是如果我将任何一个选项组合在一起，则无法在项目列表的底部显示“ other ...”选项。

例如我有这个数据集：

$scope.refs = [
    {name:'Friend'},
    {name:'Walk-in'},
    {name:'Yellow pages'},
    {name:'Field and Stream', type:'Magazines'},
    {name:'Parent', type:'Magazines'},
    {name:'Guns & Ammo', type:'Magazines'},
    {name:'other...'}
];

使用该示例，“其他...”始终出现在“黄页”和“杂志”组标题之间。

此外，我还有另一个数据集，该数据集具有两组已分组的项目，并且未分组“ other ...”选项，并且在两个组上方都显示了“ other ...”选项。

有什么方法可以将“ other ...”选项仅放在具有分组项目的列表的底部？

更新因为似乎没有解决方案，所以我只是将选项设置为静态html，而不是依靠ng-options生成它们。 然后，如果要在多个地方使用的选择字段，则可以将代码放入包含中。

Answer 1

第1期

为什么不像这样对控制器中的值进行排序：

$scope.dealers = [
    {selectLabel:"Location B", selectValue:255, for:"In state"},
    {selectLabel:"Location C", selectValue:1, for:"In state"},
    {selectLabel:"Location A", selectValue:5, for:"In state"},
    {selectLabel:"Location Z", selectValue:25, for:"Out of state"},
    {selectLabel:"Location X", selectValue:55, for:"Out of state"},
    {selectLabel:"Location Y", selectValue:50, for:"Out of state"}
].sort(function(a,b){ 
    return a.selectLabel.localeCompare(b.selectLabel); 
});

第2期

似乎不可能。 看到这个答案 。