Question

I want to replace or update data on click of button or <a> using meteor js.

I want to implement a kind of pagination type functionality.

Here's my directory structure:

/simple-todos 
    /client
        /stylesheets
        /templates
            /simple-todos.html
        simple-todos.js
    /pagination
        pagination.html
        pagination.js

Here's the code I am using:

simple-todos.html:

<div class="container">
    {{#if currentUser}}
        <ul>
            {{#each tasks}}
            {{> task}}
            {{/each}}

            {{> pagination}}
        </ul>
    {{/if}}
</div>

simple-todos.js:

Template.body.helpers({
    tasks: function () {
        return Tasks.find({}, {limit: 3}, {sort: {createdAt: -1}});
    }
});

pagination.html:

<template name="pagination">
    <ul align="center" class="pagination">
        <li><a href="#">« prev</a></li>
        <li><a href="#" class="next">next »</a></li>
    </ul>
</template>

pagination.js:

if (Meteor.isClient) {
    Template.pagination.events({
        "click .next": function() {
            event.preventDefault();
            Template.body.helpers({
                tasks: function () {
                    return Tasks.find({}, {skip:3, limit: 3}, {sort: {createdAt: -1}});
                }
            });
        }
    });
}

Answer 1

您可以使用session variable来实现此目标。

简单todos.js：

Template.body.onCreated(function () {
    Session.setDefault('tasks-page-number', 1);
});

Template.body.helpers({
    tasks: function () {
        var currentPage = Session.get('tasks-page-number');
        //check here, if currentPage is valid number, if not return 1.
        var skip = (currentPage - 1) * 3;
        return Tasks.find({}, {skip: skip, limit: 3}, {sort: {createdAt: -1}});
    }
});

pagination.js：

if (Meteor.isClient) {

    Template.pagination.events({
        "click .next": function() {
            event.preventDefault();
            var pageNumber = Session.get('tasks-page-number');
            //check if page number is valid number, if not set it to zero here.
            Session.set('tasks-page-number', (pageNumber + 1));
        }
    });
}

还有一件事，无法在事件监听器中重新定义helpers。

我想在点击按钮或<a> using meteor js

1 个答案: