我的分页有什么问题（流星）

Question

我的router.js（我用的是iron-router）：

...
PostsListController = RouteController.extend({
    template: 'postsList',
    increment: 4,
    postsLimit: function() {
        return parseInt(this.params.postsLimit) || this.increment;
    },
    findOptions: function() {
        return {sort: {submitted: -1}, limit: this.postsLimit()};
    },
    subscriptions: function() {
        this.postsSub = Meteor.subscribe('posts', this.findOptions());
    },
    posts: function() {
        return Posts.find({}, this.findOptions());
    },
    data: function() {
        var hasMore = this.posts().count() === this.postsLimit();
        var nextPath = this.route.path({postsLimit: this.postsLimit() + this.increment});
        return {
            posts: this.posts(),
            ready: this.postsSub.ready,
            nextPath: hasMore ? nextPath : null
        };
    }
});
NewsController = PostsListController.extend({
    template: 'newsTemplate',
    increment: 2,
    limit: function() {
        return parseInt(this.params.postsLimit) || this.increment;
    },
    findOptions: function() {
        return {sort: {submitted: -1}, limit: this.postsLimit()};
    },
    subscriptions: function() {
        this.postsSub = Meteor.subscribe('posts', this.findOptions());
    },
    posts: function() {
        return Posts.find({postType:'Новости'}, this.findOptions());
    },
    data: function() {
        var hasMore = this.posts().count() === this.postsLimit();
        var nextPath = this.route.path({postsLimit: this.postsLimit() + this.increment});
        return {
            posts: this.posts(),
            ready: this.postsSub.ready,
            nextPath: hasMore ? nextPath : null
        };
    }
});
Router.route('/news/:postsLimit?', {
    name: 'newsTemplate',
    controller: NewsController
});

Router.route('/:postsLimit?', {
    name: 'postsList'
});
...

我的模板（与索引模板相同，只是名称不同）：

<template name="newsTemplate">
    <div class="container main">
    <div class="row">
        {{#each posts}}
            {{> newsItem}}
        {{/each}}

    </div>
    <div class="col-md-12">
        {{#if nextPath}}
            <div class="row">
                <a class="load-more" href="{{nextPath}}" style="color: black;font-size: 1.3em;"><button type="button" class="btn btn-default btn-block">Load more</button></a>
            </div>
        {{else}}
            {{#unless ready}}
                {{> spinner}}
            {{/unless}}
        {{/if}}
    </div>
        </div>
</template>

在索引页面上（使用 PostsListController）它运行良好，但在 url http://localhost:3000/news(using NewsController 上）：

我收到了正确的帖子，但按钮 'Load more' 不起作用（点击时什么也没做）。

在url http://localhost:3000/news/2（或news/1,3等）：

它工作正常并向我显示了正确的帖子数量，按钮 'load more' 也工作正常

有什么问题吗？为什么按钮在 http://localhost:3000/news 上不起作用？

Answer 1

在您的 NewsController 中，您已将 postsLimit 函数的名称更改为限制：

limit: function() {
    return parseInt(this.params.postsLimit) || this.increment;
},

但是在你的数据函数中，你仍然指的是 this.postsLimit():

data: function() {
        var hasMore = this.posts().count() === this.postsLimit();
        var nextPath = this.route.path({postsLimit: this.postsLimit() + this.increment});
        return {
            posts: this.posts(),
            ready: this.postsSub.ready,
            nextPath: hasMore ? nextPath : null
        };
    }

将您的限制函数更改为 newsLimit 以使其更清晰，然后将数据函数更改为使用 this.newsLimit()。

我的分页有什么问题（流星）

What's wrong with my pagination(Meteor)

meteor

iron-router