Angular UI select2 - 如何停止自动排序？

Posted 2023-05-07

【中文标题】Angular UI select2 - 如何停止自动排序？

【英文标题】：Angular UI select2 - How to stop automatic sorting?

【发布时间】：2013-01-21 13:24:28

【问题描述】：

以下数据通过Angular UI附加到select2：(Live example here)

JS：

$scope.items = [
  id: 1, text: 'elephant', 
  id: 2, text: 'desk', 
  id: 3, text: 'car', 
  id: 4, text: 'boat', 
  id: 5, text: 'apple'
];
$scope.selected = [];

html：

<select ui-select2 
        multiple 
        ng-model="selected" 
        data-placeholder="Please select..." 
        style="width:200px">
  <option></option>
  <option ng-repeat="item in items" value="item.id">item.text</option>
</select>

但是，每次选择项目时，它都会按id 对所选项目进行排序。例如，如果您选择“apple”然后选择“boat”，则selected 项目将是“boat”和“apple”（按此顺序！）。

如何保留订单并禁用自动排序？

【问题讨论】：

Select2 中的 vanilla JS 会发生这种情况，还是仅 AngularUI 会发生这种情况？

我完全不确定为什么会这样。你能开一个项目的票吗？

@ProLoser: github.com/angular-ui/angular-ui/issues/406

【参考方案1】：

如果您使用ng-options 而不是对每个项目都使用ng-repeat，例如看到here，它看起来会保留顺序

你所要做的就是删除这一行：

<option ng-repeat="item in items" value="item.id">item.text</option>

然后在你的标签中添加这样的指令：

ng-options="item.text for item in items"

这将使整个项目对象被附加到所选列表中，而不仅仅是 ID，因此您需要考虑到这一点。

【讨论】：

ui-select2 与ng-options 不兼容，会产生异常行为。