如何仅显示我的骨干集合中的3个项目

时间:2014-11-04 22:48:03

标签: javascript backbone.js underscore.js

m new in backbone and I坚持这个问题。我需要为我的收藏显示3个项目,然后点击后显示更多显示另外3个项目。 我知道我可以使用first() underscore.js方法作为$(function() { var Tasks = Backbone.Model.extend(); var TasksList = Backbone.Collection.extend({ model: Tasks, url: 'json/data.json' }); var TasksView = Backbone.View.extend({ el: "#tasks", template: _.template($('#taskTemplate').html()), render: function() { _.each(this.model.models, function(tasks){ var taskTemplate = this.template(tasks.toJSON()); $(this.el).append(taskTemplate); }, this); return this; } }); var tasks = new TasksList(); var tasksView = new TasksView({model: tasks}); tasks.fetch({reset:true}); tasks.bind('reset', function () { tasksView.render(); }); }); ,但是怎么做? 这是我的代码:

{{1}}

1 个答案:

答案 0 :(得分:1)

您可以使用下划线first方法。希望这有帮助

var TasksView = Backbone.View.extend({

    el: '#tasks',

    template: _.template($('#taskTemplate').html()),

    initialize: function () {
        this.listenTo(this.collection, 'reset', this.render);
    },

    render: function () {
        _.each(this.collection.first(3), function (task) {
            var html = this.template(task.toJSON());

            this.$el.append(html);
        }, this);

        return this;
    }
}

var tasks = new TasksList(),   
    tasksView = new TasksView({ collection: tasks });

tasks.fetch({ reset:true });