1

我允许用户按下保存按钮，因此在该按钮的事件方法中，我需要保存集合中的所有现有模型并销毁在按下按钮之前删除的所有模型。

我想做的是在这一切发生时显示一个 ajax gif。如何知道所有 model.save() 和 model.destroy() 方法何时完成？

这是按下保存按钮时我调用的方法：

  Save: function() {
                var response = confirm("Are you sure you want to save?");

                if (response == true) {
                    // save items
                    var self = this;
                    this.collection.each(function(item) {
                        self.RemoveTempId(item);  // if temp id exists remove it
                        item.save();
                    });
                    // destroy items in the trashcan
                    for (var i = this.trashCan.length - 1; i >= 0; i--) {
                        this.trashCan[i].destroy();
                    }
                }
            },

当他们都完成后，我如何才能进入一个事件，以便我可以隐藏我的 ajax gif？谢谢..

4

2 回答 2

1

这些方法（save和destroy）中的每一个都返回一个承诺。when您可以使用 jQuery方法等待多个 Promise 完成。例如：

$.when( model.save(), model2.destroy() ).then(function() { /* do stuff */ });

当然，这应该适合您的用例（因为您循环遍历每个模型，因此您可能会使用一个数组和.apply()deferred on 的数组when），但是您明白了主要思想。

另外，我建议将confirm视图中的对话框和加载 gif 与模型/集合分开。这将创建更好的关注点分离和更易于管理的代码。

带有延迟数组的示例：

var defs = [];
this.collection.each(function(item) {
    defs.push( item.save() );
});

$.when.apply( null, defs ).then(function() {
    /* everything is saved */
});
于 2013-04-22T17:02:24.617 回答
0

当用户在您的提示后同意保存时，只需在页面上显示您的 GIF 图像并将其位置设置为您要显示的位置。可能，您应该将其显示在屏幕中央。

在您的保存方法中传递一个成功和错误处理程序作为选项哈希并在那里隐藏您的 GIF 图像。

查看Backbone Model 保存文档

一些伪代码是这样的：-

saveModel: function() {
    //Show image now. Use CSS to make it visible.
    $('#gifSelector').show();

    model.save({ 'x':1, 'y':2}, // The default attributes in your model which we wanna save
    success: function() {
        alert('Model has been saved');
        //Hide Gid image
        $('#gifSelector').hide();
    },
    error: function(e) {
        alert('Encountered some problem in saving model');
        // Hide GIF image
        $('#gifSelector').hide();
    }
}

一个建议：由于您将为每个模型调用此方法，并且每次我们不想查询 DOM 以使用其选择器获取 GIF 图像。最好存储对它的全局引用并使用该引用显示/隐藏它。它会更快;）

于 2013-04-22T16:59:33.353 回答