angular-selectize中如何让添加的None选项固定在选项列表顶部？

我来帮你搞定这个排序问题！你现在的配置会把所有选项（包括"None"）都按name字段排序，所以它会被插到字母顺序对应的位置。要让它固定在顶部，有两种简单的实现方式：

方法一：自定义排序函数 #

Selectize的sortField支持传入一个自定义比较函数，我们可以在函数里优先处理"None"选项，再对其他选项正常排序：

sortField: function(a, b) {
  // 把id为空的"None"选项固定在最前面
  if (a.id === '') return -1;
  if (b.id === '') return 1;
  // 其余选项按name字段升序排序
  return a.name.localeCompare(b.name);
}

逻辑说明： #

• 当比较的两个选项中，a是"None"时，返回-1表示a排在b前面；
• 当b是"None"时，返回1表示b排在a前面；
• 其他情况使用localeCompare按name字段的字母顺序升序排序。

方法二：添加优先级字段排序 #

如果需要更灵活的排序规则（比如以后要加其他固定位置的选项），可以给"None"选项添加一个优先级字段，然后让排序先按优先级，再按名称：

onInitialize: function(selectize) {
  // 给"None"选项添加priority字段，值设为0（比其他选项小）
  selectize.addOption({id: '', name: 'None', priority: 0});
},
sortField: [
  {field: 'priority', direction: 'asc'}, // 先按优先级升序，0会排在最前面
  {field: 'name', direction: 'asc'}       // 再按名称升序排序其他选项
]

注意事项： #

• 确保其他动态加载或预设的选项的priority字段值大于0（比如默认设为1），这样它们会排在"None"之后。

两种方法都能完美解决你的问题，第一种更直接，不需要修改选项结构；第二种扩展性更强，适合复杂场景。

内容的提问来源于stack exchange，提问作者Petran