Как получить доступ к составному виду из экземпляра представления элемента в Магионте Магистра

Основная ситуация такова:

У меня есть 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 );