backbone.js集合在创建时是否添加空元素？
我假设这要么是我代码中的一个bug，要么是backbone.js的一个未记录（据我所知）特性。当我创建我的集合和视图时，集合中已经有一个模型我没有创建，或者我假设由于未定义的id我没有创建。下面是我的代码backbone.js集合在创建时是否添加空元素？,backbone.js,Backbone.js,我假设这要么是我代码中的一个bug，要么是backbone.js的一个未记录（据我所知）特性。当我创建我的集合和视图时，集合中已经有一个模型我没有创建，或者我假设由于未定义的id我没有创建。下面是我的代码 // ---------------------------------------------------------- Work Order window.WO = Backbone.Model.extend({ default: { wonum: null,
// ---------------------------------------------------------- Work Order
window.WO = Backbone.Model.extend({
default: {
wonum: null,
part: null,
desc: null,
comment: null,
order: null,
section: null
},
url: "/rest/wo/"
});
window.WOView = Backbone.View.extend({
tagName: "tr",
className: "wo",
events: {
"keypress .woComment" : "updateOnEnter"
},
initialize: function(options)
{
_.bindAll(this, 'render', 'close', 'updateOnEnter');
this.render = _.bind(this.render, this);
this.model.bind('change', this.render);
},
render: function()
{
$(this.el).html(this.woTemplate(this.model.toJSON()));
this.input = this.$('.woComment');
this.input.bind('blur', this.close);
return this;
},
woTemplate: _.template($('#woTemplate').html()),
close: function()
{
this.model.set({comment: this.input.val()});
this.model.save({},{contentType: 'application/jason'});
},
updateOnEnter: function(e) {
if (e.keyCode == 13) this.close();
}
});
// ------------------------------------------------------------- Section
window.SectionC = Backbone.Collection.extend({
comparator: function(woObj)
{
return woObj.get('order');
}
});
window.Section = Backbone.Model.extend({
defaults: {
id: null,
name: null
},
events: {
'update' : 'doOrder',
'change' : 'doOrder'
},
url: "/rest/section",
woc: null,
initialize: function()
{
this.woc = new SectionC({model: window.WO});
},
add: function(woObj)
{
this.woc.add(woObj);
this.doOrder();
},
doOrder: function()
{
console.log("Calling doOrder");
var that = this;
var sel = "#sec"+this.get('id')+" .wo";
$(sel).each(function(i,elem)
{
var elemID = $(elem).attr('id');
var woObj = that.woc.get(elemID);
woObj.set({order: i});
});
},
});
window.SectionView = Backbone.View.extend({
tagName: "table",
className: "section",
initialize: function()
{
_(this).bindAll('add','remove','change');
this.render = _.bind(this.render, this);
this.mySort = _.bind(this.mySort, this);
},
sectionTemplate: _.template($('#sectionTemplate').html()),
render: function()
{
this._rendered = true;
var that = this;
$(this.el).empty();
$(this.el).attr('id',"sec"+this.model.get('id'));
var woData = null;
_(this.models).each(function(woObj)
{
var wov = new WOView({
model: woObj,
id: woObj.get('wonum')});
woData += wov.render().el;
});
$(this.el).html(this.sectionTemplate({woData: woData}));
return this;
},
add: function(woObj)
{
woObj.set({section: this.model.id, id: woObj.get('wonum')});
this.model.add(woObj);
if(this._rendered)
{
var wov = new WOView({
model: woObj,
id: woObj.get('wonum')});
$(this.el).append(wov.render().el);
}
//this.mySort();
},
change: function()
{
this.render();
},
mySort: function()
{
var that = this;
var sel = "#sec"+this.model.get('id')+" .wo";
$(sel).each(function(i,elem)
{
var elemID = $(elem).attr('id');
var woObj = that.model.woc.get(elemID);
woObj.set({order: i});
});
},
saveSection: function()
{
var json = {};
json.section = this.model.get('id');
json.order = {};
var sel = "#sec"+this.model.get('id')+" .wo";
$(sel).each(function(i,elem)
{
json.order[i] = $(elem).attr('id');
});
console.log(json);
_(this.model.woc.models).each(function(woObj)
{
if(woObj.get('id') != "" && woObj.get('id') != undefined)
woObj.save();
});
}
});
// ---------------------------------------------------------------- Page
window.PageC = Backbone.Collection.extend({
comparator: function(obj)
{
return obj.get('order');
}
});
window.PageView = Backbone.View.extend({
tagName: "div",
className: "prodSchedPage",
initialize: function()
{
_(this).bindAll('add');
this.render = _.bind(this.render, this);
},
render: function()
{
var that = this;
this._rendered = true;
$(this.el).empty();
// Loop through the sections and render them
_(this.collection.models).each(function(secObj)
{
var v = new SectionView({model: secObj, id: secObj.get('id')});
$(that.el).append(v.render().el);
});
return this;
},
add: function(sectionObj)
{
this.collection.add(sectionObj);
if(this._rendered)
{
this.render();
}
},
addSection: function(sectionObj){this.add(sectionObj);},
addWO: function(secID,woObj)
{
var secObj = this.collection.get(secID);
if(secID = undefined)
{
alert("Error: Section does not exist!");
return;
}
secObj.add(woObj);
}
});
window.PSPage = new window.PageC({});
window.PSPV = new window.PageView({collection: window.PSPage});
$("body").append(window.PSPV.render().el);
//window.PSPV.add(new Section({id: 1, name: "Section 1"}));
实例化集合时，第一个参数是模型数组，第二个参数是选项
window.PSPage = new window.PageC({});
我遇到了同样的问题，因为我需要将参数传递给我的集合构造函数。如果我查看我的集合实例，它会说没有模型，但如果我使用each（）进行迭代，它会发现我没有创建的幻影模型 基于已接受的答案，我返回并再次查看API 我的代码现在看起来像这样，似乎可以避免这个问题：
var myCollection = new MyCollection(new Array(), {
setting1: "foo",
setting2: "bar"
});
从集合的构造函数/初始化的主干文档：
new Backbone.Collection([models], [options])
var myCollection = Backbone.Collection.extend({
// add model, url, etc here
initialize: function (models, options) {
// use options here, e.g.
this.setting1 = options.setting1;
this.setting2 = options.setting2;
}
});
非常感谢。我知道我一定是错过了什么。嗯。。所以，如果你有一个构造函数方法，那么什么是防止创建空对象的最好方法呢？希望我能不止一次地给出这个答案！谢谢：）
new Backbone.Collection([models], [options])
var myCollection = new MyCollection([], {
setting1: "foo",
setting2: "bar"
});
var myCollection = Backbone.Collection.extend({
// add model, url, etc here
initialize: function (models, options) {
// use options here, e.g.
this.setting1 = options.setting1;
this.setting2 = options.setting2;
}
});