Я пытаюсь использовать агрегатор событий, чтобы убрать метод с точки зрения модели. Проблема в том, что когда я запускаю метод обновления или сохранения для ItemView
, он выполняет итерацию по всем моделям коллекции. Как я могу заставить его не только правильно отлаживать модель, которую представляет представление (или новый модальный в случае метода save
), но и не позволяет ей стрелять для каждой модели в коллекции?Магистраль - запуск агрегатора для всех моделей в коллекции
Эта заявка состоит из коллекции Items
, каждая из Item
имеет модель, которая отображается в ItemView
и приведена на странице. Если пользователь нажимает значок элемента edit
, создается экземпляр ModalView
, а текущие данные модели Item
вводятся в ModalView
.
ModalView
который загружается с шаблоном для соответствующей задачи. Для этого экземпляра я загружаю шаблон для редактирования Item
. Вот краткое описание соответствующего кода:
var ModalView = Backbone.View.extend({
tagName: "section",
className: "modal",
events: {
'click .close': 'close',
'click .minimize': 'minimize',
'click .maximize': 'maximize',
'click .save-item': 'saveItem',
},
html: null,
initialize: function(options) {
this.template = _.template(ModalTemplate);
this.vent = options.vent;
},
saveItem: function() {
this.vent.trigger('item.save');
},
});
вид коллекции элементов находится здесь:
var ItemsView = Backbone.View.extend({
tagName: 'ul',
className: 'item-items',
render: function(){
var self = this;
// Make it flex GRRRR
this.$el.addClass('flex-item');
this.collection.each(function(item) {
var date = item.get('created_at');
var itemView = new ItemView({ model: item, vent: App.vent });
this.$el.append(itemView.render().el);
}, this);
return this;
}
});
Наконец, вид элемента модели, который содержит метод редактирования, который стреляет в ModalView
var ItemView = Backbone.View.extend({
tagName: 'li',
className: 'item',
events: {
'click .edit-item': 'edit'
},
initialize: function(options) {
this.template = _.template(ItemTemplate);
options.vent.bind("item.save", this.save);
options.vent.bind("item.update", this.update);
},
save: function() {
var attributes, item;
item = new App.api.item.model();
attributes = getMeta(true);
item.save(attributes)
.done(function(res) {
Ui.modal.destroy();
// Re-render items
App.routers.main.render.User.sidebar();
App.routers.main.render.Item.items(function() {
Ui.resizeContent();
});
})
.fail(function(res) {
console.log(res);
});
},
update: function() {
console.log('update') // fires App.api.item.collection.length times
var attributes, item;
item = App.api.item.collection.get(App.rendered.modal.$el.data('id'));
attributes = getMeta();
item.save(attributes)
.done(function(res) {
Ui.modal.destroy();
// Re-render items
App.routers.main.render.Item.items(function() {
Ui.resizeContent();
});
})
.fail(function(res) {
console.log(res);
});
},
edit: function() {
Ui.modal.new(ItemModalTemplate, this.model.attributes);
App.rendered.modal.$el.attr('data-id', this.model.get('_id'));
// New Editor
var editor = document.querySelector('#item-editor');
window.editor = new MediumEditor(editor, editorOptions);
}
});
Очевидно, что я пропустил что-то фундаментальное здесь, потому что console.log('update')
в методе save
ItemView
пожаров на каждый элемент в коллекции. То, что я пытался сделать, это сохранить логику для save
и update
на вид для Item
для организационных целей.
Большое спасибо.