我正在尝试将选项标签动态地放入选择列表中。
当按下ADD按钮时，输入文本中的值被设置为一个新模型的字段，然后这个模型被推送到集合中（通过 .create 方法），并触发一个事件以刷新选择视图。问题是我需要新创建模型的 ID 属性将其放入DOM（Collection.create 返回模型实例，但触发的事件传递了“不完整”模型）。
//选项视图
optionView = Backbone.View.extend({
tagName: 'option',
attributes: function(){
var f1 = this.model.get("f1");
var id = this.model.get("id");
return {
value: f1,
id: id
};
},
render: function(){
this.$el.text(this.model.get("f1"));
return this;
}
});
//选择视图
selectView = Backbone.View.extend({
el: '#container',
collection: selectList,
events: {
"click #add-season": "create",
},
initialize: function () {
var options = this.collection;
this.$addInput = this.$('#new-opt');
_.bindAll(this, 'appendOne', 'appendAll');
options.on('add', this.appendOne);
options.on('reset', this.appendAll);
options.fetch(); // Loads list from local storage
},
appendOne: function(opt) { //PROBLEM! opt doesn't have auto-generated ID yet
var view = new app.OptionView({model: opt});
this.$("#select-list").append( view.render().el );
},
appendAll: function() {
this.$("#select-list").html('');
this.collection.each(this.appendOne);
},
create: function() {
this.collection.create({
f1: this.$addInput.val()
});
this.$addInput.val('');
}
});