Marionette.Renderer

Объект Renderer был извлечён из процесса рендеринга ItemView, чтобы создать согласованный и повторно используемый метод рендеринга шаблона с данными или без них.

Индекс документации

• Базовое использование
• Предкомпилированные шаблоны
• Настройка выбора и рендеринга шаблонов
• Использование предкомпилированных шаблонов

Базовое использование

Основное использование Renderer заключается в вызове метода render. Этот метод возвращает строку, содержащую результат применения шаблона, используя объект data в качестве контекста.

var template = "#some-template";
var data = {foo: "bar"};
var html = Marionette.Renderer.render(template, data);

// do something with the HTML here

Если вы передаёте template, который приводит к ложному значению, метод render выбросит исключение, указывая на отсутствие предоставленного шаблона.

Предкомпилированные шаблоны

Если параметр template функции render является функцией, рендерер рассматривает её как предкомпилированный шаблон и не пытается его повторно скомпилировать. Это позволяет любому представлению, поддерживающему параметр template, указать функцию предкомпилированного шаблона как значение template.

var myTemplate = _.template("<div>foo</div>");
Marionette.ItemView.extend({
  template: myTemplate
});

Функция шаблона не должна быть каким-то конкретным движком шаблонов. Она должна лишь быть функцией, которая возвращает допустимый HTML в виде строки из параметра data , переданного в функцию.

Настройка выбора и рендеринга шаблонов

По умолчанию рендерер принимает объект селектора jQuery в качестве первого параметра и необязательный объект данных JSON в качестве второго параметра. Затем он использует TemplateCache для загрузки шаблона по указанному селектору и рендерит шаблон с предоставленными данными (если они есть) с помощью шаблонов Underscore.js.

Если вы хотите переопределить способ загрузки шаблона, обратитесь к объекту TemplateCache.

Если вы хотите переопределить движок шаблонов, измените метод render, чтобы он работал так, как вам нужно:

Marionette.Renderer.render = function(template, data){
  return $(template).tmpl(data);
};

Эта реализация заменит рендеринг по умолчанию Underscore.js рендерингом шаблонов jQuery.

Если вы переопределяете метод render и хотите использовать механизм TemplateCache, не забудьте включить код, необходимый для извлечения шаблона из кэша, в свой метод render:

Marionette.Renderer.render = function(template, data){
  var template = Marionette.TemplateCache.get(template);
  // Do something with the template here
};

Использование предкомпилированных шаблонов

Вы можете легко заменить стандартную функциональность рендеринга шаблонов предкомпилированным шаблоном, таким как те, которые предоставляют плагины JST или TPL для AMD/RequireJS.

Для этого просто переопределите метод render , чтобы он возвращал ваш обработанный шаблон с данными.

Marionette.Renderer.render = function(template, data){
  return template(data);
};

Затем вы можете указать функцию предкомпилированного шаблона как атрибут вашего представления template:

var myPrecompiledTemplate = _.template("<div>some template</div>");

Marionette.ItemView.extend({
  template: myPrecompiledTemplate
});