如何在集合创建后重新获取主干集合?

时间:2016-10-28 12:48:10

标签: javascript backbone.js backbone-collections

在创建新模型时,有人可以告诉我如何在调用collection create函数后重新获取Backbone集合吗?

在创建新模型后,当我在我的收藏中调用fetch时,有时候我会得到那个模型,有时却没有。

我的问题是当我在我的集​​合中创建一个新模型时,我没有得到我的模型的ID,然后我无法立即更新它,我需要刷新页面然后我得到了id创建的模型。

我尝试使用listenTo,但我无法使用它,因为我需要向一个函数发送更多集合。

我对我的引导模式的看法,在保存我正在创建我的模型时它会持久存储到数据库中,当我创建它时,我会在控制台中获取所有属性,除了模型ID。

骨干视图:

app.types.EditView = Backbone.View.extend({

    tagName: "div",

    $container: $('#containerEdit'),
    template: _.template($('#itemEdit-template').html()),

    events: 
    {
            "click .save": "save",
    },

    initialize: function(options)
    {   
            this.options = options;

            this.$container.html(this.render());

            this.start();
            this.end();
    },

    render: function() 
    {
            this.$el.html(this.template());
            return this.$el;
    },

    save: function() 
    {
            console.log("save");
            $('#openModal').modal('hide');
            var dan = this.model.dan_u_tjednu_usera.datum;
            var mjesec = this.model.dan_u_tjednu_usera.mjesecBrojevi;
            var godina = this.model.dan_u_tjednu_usera.godina;
            var start = $("#start").val();
            var end = $("#end").val();
            var user_id = this.model.user.id;

            this.model.shifts.create({day: dan, month: mjesec, year: godina, time_from: start, time_to: end, user_id: user_id});
            this.options.model.el.html($("<td href='#openModal' width='25%' align='center' class='list-group test' scope='row'>" + start + " - " + end + " " + "Admin" + "</td>"));
            this.model.shifts.fetch({sync: true});
            console.log("test", this.model.shifts);

    }

在这里你可以看到我的回复中没有获得id属性,在创建。

enter image description here

在这里,你可以看到我点击我的单元格时我记录了我的收藏,而且我没有创建模型的id属性。当我记录this.model

时,我也没有获得id属性

enter image description here

2 个答案:

答案 0 :(得分:1)

这是因为当您调用Collection.create时发送到服务器的请求是异步的,Javascript代码将在服务器接收并响应请求之前继续执行。

如果您希望使用从服务器返回的ID更新模型,可以在{wait: true}调用中指定Collection.create。这意味着收集将直接添加模型,而是仅在服务器响应(成功)时。

在这种情况下,您应该之后立即运行fetch,因为它还需要等待创建操作完成。您应该设置以下任何操作以在创建操作完成时触发。这是一个例子:

var model = collection.create({field: 'abc'}, {wait: true});
model.once('sync', function() { window.alert(model.id); });

答案 1 :(得分:1)

Backbone's create

  

在集合中创建模型的新实例的便利性。   相当于使用属性哈希实例化模型,保存   将模型添加到服务器,然后将模型添加到集合中   成功创建。

创建后无需获取集合,模型id和任何其他字段会在其attributes哈希中自动合并。

创建模型后获取

虽然mikeapr4没有错,但他的例子可以改进。

{ wait: true }是不必要的,如果唯一的问题来自fetch,而不是来自已经在集合中的模型。

此外,once应该避免,因为它是旧的&#34;方式,而应使用listenToOnce。请参阅Difference between ListenTo and on

如果你真的想在创建一个模型后获取,那么在这里使用事件是过度的,相反,使用成功回调是最好的:

save: function() {
    // ..snip...
    this.model.shifts.create({ /* ...snip... */ }, {
        context: this,
        success: this.onModelCreated
    });
},

onModelCreated: function() {
    // the model is now created and its attributes are up-to-date
    this.model.shifts.fetch();
}

关于您的代码的其他说明

Backbone中没有sync选项。只有"sync"个事件和sync个功能。

避免使用全局jQuery选择器(如$('.class-name')),而只要元素在视图元素中,请使用this.$('.class-name')

此外,缓存jQuery元素以避免代价高昂地搜索find方法。

类似$("#start")可以缓存并重复使用。仅在重新渲染时重置缓存的元素。

Backbone .render函数应按惯例返回this

然后,您的渲染调用应如下所示:

this.$container.html(this.render().el); // el is enough