流星js自定义分页

时间:2017-09-25 17:08:31

标签: meteor pagination meteor-blaze meteor-collections

我需要支持。我在YouTube教程之后编写了一个分页,除了再次向后退的情况外,它可以正常工作。它只有2个按钮,previousnext,当点击下一个按钮时,它工作正常,但前一个按钮只返回一次。我们假设我在分页中有20条记录,一次显示5个,下一个按钮可以到第四页结尾,但前一个按钮不会向后传递一步。请问我要做什么才能获得分页经验?只要用户点击,前一个按钮就会导航到最后一页。

分页按钮的事件

Template.myviews.events({
  'click .previous': function () {
    if (Session.get('skip') > 5 ) {
      Session.set('skip', Session.get('skip') - 5 );
    }
  },
  'click .next': function () {
    Session.set('skip', Session.get('skip') + 5 );
  }
});

公开

Meteor.publish('userSchools', function (skipCount) {
  check(skipCount, Number);
  user = Meteor.users.findOne({ _id: this.userId });
  if(user) {
    if(user.emails[0].verified) {
      return SchoolDb.find({userId: Meteor.userId()}, {limit: 5, skip: skipCount});
    } else {
      throw new Meteor.Error('Not authorized');
      return false;
    }
  }
});

订阅

Session.setDefault('skip', 0);
Tracker.autorun(function () {
  Meteor.subscribe('userSchools', Session.get('skip'));
});

Blaze分页按钮

<ul class="pager">
  <li class="previous"><a href="#">Previous</a> </li>
  <li class="next"><a href="#">Next</a> </li>
</ul>

模板助手

RenderSchool: function () {
  if(Meteor.userId()) {
    if(Meteor.user().emails[0].verified) {
      return SchoolDb.find({userId: Meteor.userId()}).fetch().reverse();
    } else {
      FlowRouter.go('/');
      Bert.alert('Please verify your account to proceed', 'success', 'growl-top-right');
    }
  }
}

1 个答案:

答案 0 :(得分:1)

您共有6个文档,每页2个文档,共3页。

if按钮点击处理程序中的previous条件会阻止您转到第一页:

if (Session.get('skip') > 2 /* testing */ ) {
  ...
}

对于第二页skip将等于2,在下次点击时,此条件将为false,以防止返回。

当你在第3页时 - 你只能进入第2页,创建一个按钮只能工作一次的印象。

应该是这样的:

if (Session.get('skip') > 0 ) {
  ...
}