Question

Ember：1.1.2
Ember数据：1.0.0-beta.4 + canary.c15b8f80
把手：1.0.0
jQuery：1.10.2

我有一个对象列表，我可以根据某个属性值进行过滤，例如所有帖子仅限发布的帖子。我还创建了2个路由，因此可以使用url访问这两个列表：

App.Router.map ->
  @resource 'posts', ->    # '/posts'
    @route 'published'     # '/posts/published'

两个列表都使用相同的模板：

App.PostsRoute = Em.Route.extend
  model: ->
    @get('store').find 'post'

App.PostsIndexRoute = Em.Route.extend
  model: ->
    @modelFor 'posts'

App.PostsPublishedRoute = Em.Route.extend
  model: ->
    @modelFor('posts').filter( (item) ->
      item.get('publishAt') <= new Date()
    )
  renderTemplate: (controller) ->
    @render 'posts/index',
      controller: controller

# posts.hbs
  ...
  {{#link-to 'posts.index'}}All{{/link-to}}
  {{#link-to 'posts.published'}}Published{{/link-to}}

  {{outlet}}

# posts/index.hbs
  {{#each}}
    <li>...</li>
  {{/each}}

  {{link-to showMore}}Show More{{/link-to}}

基本控制器中的showMore操作向（Rails）后端发送请求，该后端响应下一页。

App.PostsController = Em.ArrayController.extend
  actions:
    showMore: ->
      @store.find 'post',
        page: 2

当显示未过滤的列表时，此showMore按预期工作。为了简化示例，我对页面值进行了硬编码。

但是，当显示已过滤的列表时，showMore会发送一个AJAX请求，但页面不会使用扩展的对象列表进行更新。当我在All和Published之间切换时，已发布的列表已更新。

Answer 1

调用showMore操作时，会发送AJAX请求，但不会更新列表。这是因为只有在进入路线时才会调用路由的model挂钩。

通过过滤App.PostPublishedController中的集合，您需要确保在帖子发生变化时更新列表：

App.PostPublishedController = Ember.ArrayController.extend
  needs: ['posts']
  posts: Ember.computed.alias('controllers.posts.content')

  content: ( ->
    @get('posts').filter( (item) ->
      item.get('publishAt') <= new Date()
    )
  ).property('posts.[]')

但是，我要做的是在路由器方案中映射页面：

App.Router.map ->
  @resource 'firstPostsPage', { path: '/posts' }
  @resource 'posts', { path: '/posts/:page' }, ->
    @route 'published'

App.PostsRoute = Em.Route.extend
  model: (params) ->
    @get('store').find 'post',
      page: params.page

App.FirstPostsPageRoute = Em.Route.extend
  redirect: ->
   // Redirect '/posts' to '/posts/1'
   this.transitionTo('posts', { page: 1 });

然后，以下路由定义将按预期工作，而无需在PostPublishedController

中进行过滤

App.PostsIndexRoute = Em.Route.extend
  model: ->
    @modelFor 'posts'

App.PostsPublishedRoute = Em.Route.extend
  model: ->
    @modelFor('posts').filter( (item) ->
      item.get('publishAt') <= new Date()
    )
  renderTemplate: (controller) ->
    @render 'posts/index',
      controller: controller

已过滤的列表未在分页上更新

1 个答案:

但是，我要做的是在路由器方案中映射页面：