Как получить доступ к составному виду из экземпляра представления элемента в Магионте Магистра
Основная ситуация такова:
У меня есть Composite View и Item View. Я создаю представление Composite, передавая ему модель и коллекцию. Данные модели используются для заполнения шаблона для представления Composite. Данные сбора используются для заполнения представления элемента для композитного представления.
Что я хочу сделать, так это: в помощнике шаблона для представления элемента я хочу получить доступ к данным модели для Composite View. Я получил доступ к экземпляру вида представления элемента. Я подумал, что это может дать мне представление о Composite View, откуда я могу добраться до его модели, но это не так.
Есть ли способ, которым я могу это сделать - получить доступ к экземпляру составного представления из одного из экземпляров представления его элементов?
Спасибо
- Джастин Вилли
Ответы
Ответ 1
Если вы хотите получить доступ к данным из родительского CompositeView
, вы можете сделать несколько разных вещей.
-
Либо передайте эти данные непосредственно в ItemView
через вспомогательную функцию itemViewOptions
на CompositeView
. Примечание. Этот параметр изменился на childViewOptions
в Marionette 2.
-
Вызвать метод непосредственно во всех дочерних представлениях из CompositeView
и передать все, что вы хотите, в этот метод.
-
Запуск события или прослушивания с помощью ItemView
.
Ни один из этих параметров не имеет прямого доступа к родительскому представлению от ребенка, но должен делать то, что вы хотите. Ниже приведен код использования каждого из этих подходов для передачи модели CompositeView
в представление children.
// Pass model into ItemView on init
var MyItemView = Backbone.Marionette.ItemView.extend({
initialize : function (options) {
this.parentsModel = options.parentsModel;
}
});
var MyCompView = Backbone.Marionette.CompositeView.extend({
itemViewOptions : function () { return { parentsModel: this.model }; }
itemView : MyItemView
});
// Invoke function on ItemView, passing data in
var MyItemView = Backbone.Marionette.ItemView.extend({
doSomethingWithParent : function (parentModel) {
// do cool thing with parentModel
}
});
var MyCompView = Backbone.Marionette.CompositeView.extend({
itemView : MyItemView,
onRender : function () {
this.children.call("doSomethingWithParent", this.model);
}
});
// Trigger event that ItemView knows about
var MyItemView = Backbone.Marionette.ItemView.extend({
initialize : function () {
this.listenTo(this, "special:event", function (parentModel) {
// Do cool things
});
}
});
var MyCompView = Backbone.Marionette.CompositeView.extend({
itemView : MyItemView,
onRender : function () {
this.children.each(_.bind(function (childView) {
childView.trigger("special:event", this.model);
}, this));
}
});
Ответ 2
Я не ответил на вопрос. Но меняется подход. Вместо того, чтобы пытаться получить доступ к "родительскому" композитному представлению из представления элемента, я получаю доступ к представлению элемента из композитного представления:
https://github.com/marionettejs/backbone.marionette/blob/master/docs/marionette.collectionview.md#onbeforeitemadded-callback
Я могу изменить модель текущего представления элемента (на основе значения в модели Composite View).
Ответ 3
Думал, что поделился бы тем, как мне помогло предложение Эндрю Хаббса. Я пытался отобразить свойство родительской модели inline с моим шаблоном элемента. Я использовал свойство Marionette templateHelpers, чтобы сделать это в сочетании с одним из предложений Эндрю.
Я попытался сохранить пример:
Пример композитного шаблона - шаблон myView:
<h1>Page {{name}}</h1>
<h6>Children</h6>
<ul></ul>
Пример шаблона элемента - myItemTemplate:
{{name}} is child of: {{getParentName}}
Просмотров:
App.module( 'App.View', function( View ){
View.MyItemView = Marionette.ItemView.extend({
initialize: function( options ) {
this.parentModel = options.parentModel;
},
template: myItemTemplate,
tagName: 'li',
templateHelpers: function() {
var view = this;
return {
// Called by item template, returns parent model 'name' property.
getParentName: function() {
return view.parentModel.get('name');
}
};
}
});
View.MyView = Marionette.CompositeView.extend({
template: myViewTemplate,
itemView: View.MyItemView,
itemViewContainer: 'ul',
itemViewOptions: function() {
return { parentModel: this.model };
}
});
});
Пример того, как это будет реализовано:
// example of how implementation
// parent model has an attribute called 'children', which is a collection of models
var children = parent.get('children');
var view = new App.View.MyView( { model: parent, collection: children } );
App.mainRegion.show( view );