如何设置组标签排序angularjs ui-select group-by

问题描述

我正在使用 ui-select-choices group-by 在 UI 选择中对列表进行分组，分组工作正常，但我面临的问题是组标签不是按字母顺序排列的，下面是代码片段

HTML：

<div class="col-md-5">
            <ui-select name="template" ng-model="template.data" theme="bootstrap"
              ng-disabled="ctrl.disabled" sortable="true">
              <ui-select-match placeholder="-- Select --">{{$select.selected.name}}</ui-select-match>
              <ui-select-choices group-by="'itemType'"
                repeat="rf in templates | propsFilter: {name: $select.search} | orderBy : 'name' : false">
                <div ng-bind-html="rf.name | highlight: $select.search"></div>
              </ui-select-choices>
            </ui-select>
          </div>

输出：

这个输出的问题是组不是按字母顺序排列的，即。关于如何实现这一点，“客户”应该排在“用户”之前。

注意：我已经按项目类型对数组进行了排序，但输出没有变化。

提前致谢。

解决方法

尝试 group-filter 选项：

<ui-select-choices group-by="'itemType'"
                   group-filter="orderFilterFn"
                   repeat="rf in templates | propsFilter: {name: $select.search} | orderBy : 'name' : false">
    <div ng-bind-html="rf.name | highlight: $select.search"></div>
</ui-select-choices>

并使用 orderFilterFn 在函数 $filter 中执行排序：

$scope.orderFilterFn= function(groups) {
    return $filter('orderBy')(groups,'name');
};