骨干网“重置”收集触发器未触发

发布于 2024-12-25 07:45:13 字数 2006 浏览 0 评论 0原文

我正在使用backbone.js 从 REST 服务器获取集合。获取触发器正常并用数据填充集合。然而,“重置”触发器永远不会被触发,因此 addAll() 永远不会被调用。手动调用 addAll() 工作正常 - 但为什么在集合上调用 fetch() 时“重置”没有像它应该的那样触发?

这是代码:

模型

define(['backbone-tastypie'], function(Backbone) {
    var Machine = Backbone.Model.extend({
        url: function(){
            return this.get('resource_uri') || this.collection.url;
        }
    });

    return Machine;
});

集合

define(['backbone-tastypie','models/machine'], function(Backbone, Machine) {
    var Machines = Backbone.Collection.extend({

        model: Machine,
        url: '/api/rest/machine/',
        parse: function(data){
            return data.objects;
        }
    });

    return Machines;
});

模型视图

define(['underscore','backbone-tastypie'], function(_, Backbone) {
    var MachineTableEntryView = Backbone.View.extend({
        tagName: 'tr',
        template: _.template($('#machine-row-template').html()),

        render: function(){
            $(this.el).html(this.template(this.model.toJSON()));
            console.log('lol');
            return this;
        }   
    }); 

    return MachineTableEntryView;
});

主视图

define(['underscore','backbone-tastypie','collections/machines','views/machine_table_entry'], function(_, Backbone, Machines, MachineTableEntryView) {
    var MachineTableView = Backbone.View.extend({
        el: $('#app'),

        initialize: function(){
            _.bindAll(this, 'addOne', 'addAll');

            Machines.bind('reset', this.addAll);

            this.machines = new Machines();
            this.machines.fetch();
        },

        addAll: function(){
            this.machines.each(this.addOne);
        },

        addOne: function(machine){  
            var view = new MachineTableEntryView({model:machine});
            this.$('#machines').append(view.render().el);
        },
    });

    return MachineTableView;
});

I'm using backbone.js to get a collection from the REST server. Fetch triggers fine and fills the collection with the data. However, the "reset" trigger is never fired and so addAll() is never called. Calling addAll() manually works fine - but why isn't "reset" firing as it should when fetch() is called on the collection?

Here is the code:

Model

define(['backbone-tastypie'], function(Backbone) {
    var Machine = Backbone.Model.extend({
        url: function(){
            return this.get('resource_uri') || this.collection.url;
        }
    });

    return Machine;
});

Collection

define(['backbone-tastypie','models/machine'], function(Backbone, Machine) {
    var Machines = Backbone.Collection.extend({

        model: Machine,
        url: '/api/rest/machine/',
        parse: function(data){
            return data.objects;
        }
    });

    return Machines;
});

Model View

define(['underscore','backbone-tastypie'], function(_, Backbone) {
    var MachineTableEntryView = Backbone.View.extend({
        tagName: 'tr',
        template: _.template($('#machine-row-template').html()),

        render: function(){
            $(this.el).html(this.template(this.model.toJSON()));
            console.log('lol');
            return this;
        }   
    }); 

    return MachineTableEntryView;
});

Main View

define(['underscore','backbone-tastypie','collections/machines','views/machine_table_entry'], function(_, Backbone, Machines, MachineTableEntryView) {
    var MachineTableView = Backbone.View.extend({
        el: $('#app'),

        initialize: function(){
            _.bindAll(this, 'addOne', 'addAll');

            Machines.bind('reset', this.addAll);

            this.machines = new Machines();
            this.machines.fetch();
        },

        addAll: function(){
            this.machines.each(this.addOne);
        },

        addOne: function(machine){  
            var view = new MachineTableEntryView({model:machine});
            this.$('#machines').append(view.render().el);
        },
    });

    return MachineTableView;
});

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

梦在深巷 2025-01-01 07:45:13

您需要将事件侦听器绑定到您创建的集合的实例,而不是集合构造函数:

define(['underscore','backbone-tastypie','collections/machines','views/machine_table_entry'], function(_, Backbone, Machines, MachineTableEntryView) {
var MachineTableView = Backbone.View.extend({
    el: $('#app'),

    initialize: function(){
        _.bindAll(this, 'addOne', 'addAll');

        this.machines = new Machines();
        this.machines.bind('reset', this.addAll);
        this.machines.fetch();
    },

    addAll: function(){
        this.machines.each(this.addOne);
    },

    addOne: function(machine){  
        var view = new MachineTableEntryView({model:machine});
        this.$('#machines').append(view.render().el);
    },
});

return MachineTableView;

You need to bind the event listener to the instance of the collection you create, not the Collection constructor:

define(['underscore','backbone-tastypie','collections/machines','views/machine_table_entry'], function(_, Backbone, Machines, MachineTableEntryView) {
var MachineTableView = Backbone.View.extend({
    el: $('#app'),

    initialize: function(){
        _.bindAll(this, 'addOne', 'addAll');

        this.machines = new Machines();
        this.machines.bind('reset', this.addAll);
        this.machines.fetch();
    },

    addAll: function(){
        this.machines.each(this.addOne);
    },

    addOne: function(machine){  
        var view = new MachineTableEntryView({model:machine});
        this.$('#machines').append(view.render().el);
    },
});

return MachineTableView;
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文