与Ember arrangeContent混淆,id为>的对象100没有正确分页

时间:2014-05-03 20:09:44

标签: ember.js pagination

在十字军上学习余烬,我试图用它创建一个博客,现在我正在进行分页步骤。

一切正常,除了我的ID超过100的所有帖子都没有在开头出现。

这就是我的PostsIndexController的样子 - >

Blog.PostsIndexController = Ember.ArrayController.extend({
  sortProperties: ['id'],
  sortAscending: false,

  page: 1,
  perPage: 8,
  totalPages: (function() {
    return Math.ceil(this.get('length') / this.get('perPage'));
  }).property('length', 'perPage'),

  pages: (function() {
    var collection = Ember.A();

    for(var i = 0; i < this.get('totalPages'); i++) {
      collection.pushObject(Ember.Object.create({
        number: i + 1
      }));
    }

    return collection;      
  }).property('totalPages'),

  hasPages: (function() {
    return this.get('totalPages') > 1;
  }).property('totalPages'),

  prevPage: (function() {
    var page = this.get('page');
    var totalPages = this.get('totalPages');

    if(page > 1 && totalPages > 1) {
      return page - 1;
    } else {
      return null;
    }
  }).property('page', 'totalPages'),

  nextPage: (function() {
    var page = this.get('page');
    var totalPages = this.get('totalPages');

    if(page < totalPages && totalPages > 1) {
      return page + 1;
    } else {
      return null;
    }
  }).property('page', 'totalPages'),

  paginatedContent: (function() {
    var start = (this.get('page') - 1) * this.get('perPage');
    var end = start + this.get('perPage');

    return this.get('arrangedContent').slice(start, end);
  }).property('page', 'totalPages', 'arrangedContent.[]'),

  selectPage: function(number) {
    this.set('page', number);
  }
});

这就是我的模板 - &gt;

{{#each post in paginatedContent}}
  {{ render 'posts/post' post}}
{{/each}}

{{#if hasPages}}
  <div class="pagination">
    {{#if prevPage}}
      <a href="#" class="previous_page" rel="previous" {{action "selectPage" prevPage}}>&larr; Newer</a>
    {{else}}
      <span class="previous_page disabled">&larr; Newer</span>
    {{/if}}

    {{#if nextPage}}
      <a href="#" class="next_page" rel="next" {{action "selectPage" nextPage}}>Older &rarr;</a>
    {{else}}
      <span class="next_page disabled">Older &rarr;</span>
    {{/if}}
  </div>
{{/if}}

我认为问题在于ArrangeContent正在设置数组 -

  paginatedContent: (function() {
    var start = (this.get('page') - 1) * this.get('perPage');
    var end = start + this.get('perPage');

    return this.get('arrangedContent').slice(start, end);
  }).property('page', 'totalPages', 'arrangedContent.[]'),

但是,我对arrangeContent是什么以及如何解决这个问题有点困惑。非常感谢!

2 个答案:

答案 0 :(得分:0)

我已经非常清楚为什么会发生这种情况,但我没有按ID排序,而是按照created_at进行排序,修复了问题。

sortProperties: ['created_at'],

答案 1 :(得分:0)

你可以创建另一个真实的&#34;模型的数字类型ID,以及此字段的顺序。工作正常!

App.Msgboard = DS.Model.extend({
    numericId: function(){
        var id = this.get('id');
        if (id) { return +id; }
    }.property('id'),
    name:    DS.attr('string')
});