Warning: file_get_contents(/data/phpspider/zhask/data//catemap/0/backbone.js/2.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Backbone.js 在收集时调用销毁_Backbone.js - Fatal编程技术网

Backbone.js 在收集时调用销毁

Backbone.js 在收集时调用销毁,backbone.js,Backbone.js,我正在做一个与主干Todo类似的示例应用程序。但当我在集合上调用destroy时,它会给出错误: 未捕获的TypeError:无法读取未定义的属性“destroy” 我怎样才能解决这个问题。请建议 以下是我的方法代码: $(function(){ var Todo = Backbone.Model.extend({ defaults: function() { return { title: "empty todo...", order: Todos.nextOrder(

我正在做一个与主干Todo类似的示例应用程序。但当我在集合上调用destroy时,它会给出错误:

未捕获的TypeError:无法读取未定义的属性“destroy”

我怎样才能解决这个问题。请建议

以下是我的方法代码:

$(function(){

var Todo = Backbone.Model.extend({

defaults: function() {
  return {
    title: "empty todo...",
    order: Todos.nextOrder(),
    done: false
  };
}

});


var TodoList = Backbone.Collection.extend({

  model : Todo,

  localStorage: new Backbone.LocalStorage("todos-backbone"),

  done: function() {
    return this.where({done: true});
  },

  remaining: function() {
    return this.without.apply(this, this.done());
  },

  nextOrder: function() {
    if (!this.length) return 1;
    return this.last().get('order') + 1;
  },

  comparator: 'order'   
});

var TodoView = Backbone.View.extend({

  tagName:  "li",

  template: _.template($('#item-template').html()),

  events: {
    "click a.destroy" : "clear"
  },

  initialize: function() {
    this.listenTo(this.model, 'destroy', this.remove);
  },

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

  clear: function(){
    this.model.destroy();
  }
});

var AppView = Backbone.View.extend({

  el: $("#todoapp"),

  statsTemplate: _.template($('#stats-template').html()),

  events: {
    "keypress #new-todo":  "createOnEnter",
    "click #remove-all": "clearCompleted"
  },

  initialize: function() {
    this.input = this.$("#new-todo");
    this.main = $('#main');
    this.footer = this.$('footer');

    this.listenTo(Todos, 'add', this.addOne);
    this.listenTo(Todos, 'all', this.render);

    Todos.fetch();
  },

  render: function() {
    var done = Todos.done().length;
    var remaining = Todos.remaining().length;

    if (Todos.length) {
      this.main.show();
      this.footer.show();
      this.footer.html(this.statsTemplate({done: done, remaining: remaining}));
    } else {
      this.main.hide();
      this.footer.hide();
    }
  },

  createOnEnter: function(e){
    if(e.keyCode != 13) return;
    if (!this.input.val()) return;
    Todos.create({
      title: this.input.val()
    })  
    this.input.val('');         
  },

  addOne: function(todo){
    var view = new TodoView({model: todo});
    this.$("#todo-list").append(view.render().el);
  },

  clearCompleted: function(){
    _.invoke(Todos, 'destroy');
    return false;
  }

}))

对于这个答案,我假设
Todos
TodoList
的一个实例。我还假设您的错误是由
AppView

clearCompleted: function(){
  _.invoke(Todos, 'destroy');
  return false;
}
在这里,您试图将Backbone.js
Collection
实例视为一个集合,例如列表。但是主干集合不是简单的列表,它们是具有属性
models
的对象,该属性是包含所有模型的列表。因此,试图在对象上使用下划线的
调用
,必然会导致错误

但别担心,主干网为其
模型
集合
巧妙地实现了许多下划线方法。这意味着您可以像这样为集合中的每个模型调用destroy

SomeCollection.invoke('destroy');

希望这有帮助

你的问题可能需要更多的背景。原始代码调用“Todos.done()”上的方法,该方法将在目标对象可用时延迟调用(在一个好的情况下)。你现在能想出来吗。谢谢