骨干不能从收集

删除项目我已经写了以下内容，由于某种原因，当我试图从它在removeItem函数返回undefined该项目集合中删除的项目：骨干不能从收集

Todos = (function(){ 

////////////////////////// 
// 
// MODEL 
// 
////////////////////////// 

var TodoModel = Backbone.Model.extend({ 

    defaults: { 
     id: null, 
     item: null 
    } 

}); 

////////////////////////// 
// 
// COLLECTION 
// 
////////////////////////// 

var TodoCollection = Backbone.Collection.extend({ 

    model: TodoModel 

}); 

////////////////////////// 
// 
// VIEW 
// 
////////////////////////// 

var TodoView = Backbone.View.extend({ 

    el: $('#todos'), 

    itemField: $('#new-item'), 

    initialize: function(){ 
     this.el = $(this.el); 
    }, 

    events: { 
     'submit form': 'addItem', 
     'click .remove-item': 'removeItem', 
     // Debug 
     'click #print-collection': 'printCollection' 
    }, 

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

    render: function(item) { 
     var templ = _.template(this.template); 
     var id = _.uniqueId('todo_'); 
     this.el.children('ul').append(templ({id: id,item: item})); 
    }, 

    addItem: function(e) { 
     e.preventDefault(); 
     item = this.itemField.val(); 
     // Call render 
     this.render(item); 
     // Clear field 
     this.itemField 
      .val('') 
      .focus(); 
     // Add to collection 
     var newItem = new TodoModel({ 
      item: item 
     }); 
     this.collection.add(newItem); 
    }, 

    removeItem: function(e) { 
     var thisid = this.$(e.currentTarget).parent('li').data("id"); 
     var thisitem = this.collection.get(thisid); 
     thisitem.remove(); 
     // Remove from DOM 
     $(e.target).parent('li') 
      .fadeOut(300,function() { 
       $(this).remove(); 
      }); 
    }, 

    printCollection: function(){ 
     this.collection.each(function(item) { 
      console.log(item.get('item')); 
     }); 
    } 

}); 

////////////////////////// 
// 
// SELF 
// 
////////////////////////// 

self = {}; 
self.start = function(){ 
    new TodoView({collection: new TodoCollection()}); 
}; 
return self; 

});

来源

2012-10-28 Fluidbyte

你的模板是什么样的？你确定'thisid'是你期望的吗？通常你'model.destroy（）'不''model.remove（）''thisitem.remove（）;'有点怀疑。 jsfiddle.net或jsbin.com上的功能示例会很有帮助。 –

@ muistooshort - 这是我的小提琴：http://jsfiddle.net/nYpqe/2/。看起来我根本无法抓住模型。我已经尝试了一个点击事件来提醒内容，即使这样也行不通。 – Fluidbyte

模型穿上”吨有remove方法（除非你加入一个自己），所以这不工作：

var thisitem = this.collection.get(thisid); 
thisitem.remove(); // <------ this goes boom!

模型确实有destroy方法，但这样你可以：

thisitem.destroy();

会告诉该模型已经一去不复返了服务器和"destroy"事件并触发将通知模式已经一去不复返了集合。如果你不想交谈的服务器，那么你可以告诉集合remove模型：

this.collection.remove(thisitem);

将从集合中删除它，而不会打扰服务器。

切换到this.collection.remove作品：http://jsfiddle.net/ambiguous/8chHf/

虽然我在这里，你有一个隐藏的问题就在这里：

self = {};

你分配给全球self（实际上是一个standard property of window）当你可能想分配给一个名为self的本地变量。就在这个就足够了：

return { 
    start: function() { 
     new TodoView({collection: new TodoCollection()}); 
    } 
};

，或者你可以不喜欢这样，如果你喜欢：

var self = {}; 
self.start = function(){ 
    new TodoView({collection: new TodoCollection()}); 
}; 
return self;

我更喜欢使用，因为有趣的bug _this或that代替self是window.self可能会导致如果你忘记了varvar self;或者你不小心忘记了self。是的，我很难学会这一点。

来源

2012-10-28 20:25:20

非常感谢您的解释（以及关于“自我”的说明）。我知道得更清楚，并且感觉“错误”，很高兴得到清除！ – Fluidbyte

骨干不能从收集

回答

相关问题