如何订购模型？Ember新手如何按标题排序电影列表

1. 如何订购一个模型？ #

“订购模型”的含义会根据场景有所不同，这里给你两种常见情况的解决方案：

• 如果是在Ember.js中创建并保存模型实例（比如添加新的业务数据记录）：
  你可以通过Ember Data的store.createRecord方法创建模型实例，再调用save()持久化到后端：

  // 在组件或控制器中执行
  let newMovie = this.store.createRecord('movie', {
    title: '星际穿越',
    releaseDate: new Date('2014-11-07')
  });
  newMovie.save().then(() => {
    console.log('模型保存成功');
  }).catch(error => {
    console.error('保存失败：', error);
  });
  

• 如果是业务上订购模型类产品（比如机器学习模型、付费数据模型）：
  这取决于你选择的服务平台，通常需要进入对应平台的控制台，选择目标模型后按照指引完成下单、支付等操作，不同平台的流程会有差异，建议查看平台官方文档。

2. Ember新手：如何按标题排序电影列表？ #

嘿，我刚入门Ember的时候也纠结过这个问题！其实有几种实用的实现方式，我给你拆解下每种的适用场景：

方案一：路由层排序（全局默认排序首选） #

你之前考虑的在路由model钩子中排序完全可行！如果这个电影列表所有场景下都需要按标题排序，把排序逻辑放在路由层是最优的——因为路由的核心职责就是准备页面需要的数据，组件直接拿到排好序的结果就行：

// index路由文件
export default Route.extend(RealtimeRouteMixin,{
  model() {
    return this.store.findAll('movie').then(movies => {
      // 按标题升序排序，toLowerCase避免大小写干扰排序结果
      return movies.sortBy('title').map(movie => movie);
      // 如果需要降序，直接追加reverse()：
      // return movies.sortBy('title').reverse();
    });
  }
});

注意：Ember数组的sortBy方法会返回一个新的排序后的数组，不会修改原数据集合。

方案二：组件内计算属性排序（灵活排序首选） #

如果之后你可能需要切换排序规则（比如按上映日期、评分排序），把排序逻辑封装在movie-list组件里会更灵活。我们可以给组件添加一个计算属性，基于传入的movies自动生成排序后的列表：

// movie-list组件的js文件
import Component from '@ember/component';
import { computed } from '@ember/object';

export default Component.extend({
  // 计算属性：监听movies的每个title变化，自动重新排序
  sortedMovies: computed('movies.@each.title', function() {
    const movies = this.get('movies');
    if (!movies) return [];
    
    // 自定义排序逻辑，统一转小写避免大小写影响
    return movies.sort((a, b) => {
      const titleA = a.get('title').toLowerCase();
      const titleB = b.get('title').toLowerCase();
      if (titleA < titleB) return -1;
      if (titleA > titleB) return 1;
      return 0;
    });
  })
});

然后在movie-list模板里改用这个计算属性遍历：

{{#each sortedMovies as |movie|}}
  {{movie-list/movie-list-item movie=movie }}
  <hr />
{{/each}}

这个方案的好处是组件自主控制排序逻辑，路由无需关心；而且如果之后要加排序切换按钮（比如升序/降序切换），只需要给组件加个sortDirection属性，修改计算逻辑即可。

方案三：后端查询排序（大数据量首选） #

如果你的后端API支持排序参数（比如?sort=title），那直接让后端返回排好序的数据会更高效，尤其是数据量较大的时候：

// index路由文件
export default Route.extend(RealtimeRouteMixin,{
  model() {
    // 假设后端支持sort参数，传入title指定按标题排序
    return this.store.query('movie', { sort: 'title' });
  }
});

这种方式能减少前端的计算开销，同时保证数据一致性。

小技巧提醒 #

排序时一定要处理大小写问题！不然会出现大写字母优先的情况（比如"Zootopia"会排在"avatar"前面），用toLowerCase()统一转换后再比较就能解决这个问题。另外，因为你用了RealtimeRouteMixin，计算属性的movies.@each.title会在任何电影标题更新时自动重新计算排序，完美适配实时更新的场景。

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