如何使用 Firebase 从 backbone 集合中删除模型

Question

我有一个集合，我想从中删除一个模型并让它实时同步：

var ClientCollection = Backbone.Firebase.Collection.extend({
  model: Client,
  url: "https://<my-firebase-url>.firebaseio.com",
  autoSync: true
});

我已经使用我的 clear 函数从集合中尝试了以下内容：

var ClientView = Backbone.View.extend({
  tagName:  "li",
  className: "list-group-item",
  template: _.template("<%= name %>"),
  events: {
    "click .destroy" : "clear"
  },
  initialize: function() {
    this.listenTo(this.model, "change", this.render);
  },
  render: function() {
    this.$el.html(this.template(this.model.toJSON()));
    return this;
  },
  clear: function() {
      this.model.remove();
  },
});

然而，这只会从 DOM 中删除模型。

如何从服务器和 DOM 中删除模型？

Answer 1

集合视图需要稍微更改才能从 DOM 和服务器中删除。

使用 listenTo 确保同步更改和将模型从 DOM 中删除。

将以下内容添加到您的 initialize 函数中。

// This will listen for the destroy method and then remove the item from the dom
this.listenTo(this.model, "destroy", this.remove);

然后在 clear 函数中使用 destroy:

clear: function() {
    this.model.destroy({success: function(model, response) {
       // Do something if successful
    }});
},

完整视图应该是这样的：

var ClientView = Backbone.View.extend({
  tagName:  "li",
  className: "list-group-item",
  template: _.template("<%= name %>"),
  events: {
    "click .destroy" : "clear"
  },
  initialize: function() {
    this.listenTo(this.model, "change", this.render);
    this.listenTo(this.model, "destroy", this.remove);
  },
  render: function() {
    this.$el.html(this.template(this.model.toJSON()));
    return this;
  },
  clear: function() {
    this.model.destroy({success: function(model, response) {
      $('.notification').fadeIn(200).html('Success - Item removed').fadeOut(1000);
      return this;
    }});
  },
});

以上代码按预期工作

如何使用 Firebase 从 backbone 集合中删除模型

How to delete model from backbone collection using Firebase

javascript

backbone.js

firebase

backbonefire