EmberJS上的分页和过滤

时间:2014-02-07 18:14:50

标签: rest ember.js pagination ember-data

EmberJS鼓励我们尽可能在任何地方依赖路径,并且很容易在输入路径上使用参数来正确设置控制器。但是,如果您不关心将位置转移给某人并希望动态地使用复杂过滤与分页相结合,该怎么办?我要展示我想出的东西。只要我在路径上没有遇到太多相关指南,这可能会很有用。

1 个答案:

答案 0 :(得分:2)

首先,我在服务器端拥有的内容:

1)我使用has_scope,因此查询参数正在URL中传输。 2)我的模板由index action生成如下: {“演员”:[..模型去这里..],“元”:{“总计”:10,“页面”:1}} 所以我通过json响应传递总页数和当前页面。

这是路线:

Caster.ActorsIndexRoute = Ember.Route.extend

  model: ->
    @store.findQuery 'actor',
      search: @get('controller.term')
      page: @get('controller.page')

  actions:
    refresh: ->
      @model().then (data) =>
        @set 'controller.model', data

这里我们重复一下setupController对'refresh'事件所做的事情。此事件将由控制器发送:

Caster.ActorsIndexController = Ember.ArrayController.extend

  term: ''
  page: 1

  terms: ( -> @reload() ).observes('term', 'page')
  meta: ( -> @store.metadataFor('actor') ).property('model')
  updatePage: ( -> @set 'page', @get('meta.page') ).observes('model')

  reload: -> @get('target').send('refresh')

剩下的就是构建分页小部件,它将改变控制器的'page'属性并导致重新加载集合。当'term'属性发生变化时,也会发生这种情况。

这里的一个问题是路由初始化时没有可用的控制器属性,因此第一次获得非范围的集合。