Использование руля с позвоночником - PullRequest
Новая
       22

Использование руля с позвоночником

49 голосов
/ 31 января 2012

Я изучаю Магистраль / Руль / Требую.Я просмотрел все онлайн и на SO - есть ли какие-либо учебные пособия или веб-сайты, на которые вы можете направить меня, чтобы они содержали полезную информацию для использования рулей вместо подчеркивания?

Ответы [ 4 ]

79 голосов
/ 01 июня 2012

Использование handlebars.js вместо underscore довольно просто.Посмотрите на этот пример:

https://cdnjs.com/libraries/backbone.js/tutorials/what-is-a-view (прокрутите до раздела «Загрузка шаблона») 

SearchView = Backbone.View.extend({
    initialize: function(){
        this.render();
    },
    render: function(){
        // Compile the template using underscore
        var template = _.template( $("#search_template").html(), {} );
        // Load the compiled HTML into the Backbone "el"
        this.el.html( template );
    }
});

По сути, в основе лежит соглашение о создании HTML вфункция рендеринга.Использование шаблонизатора полностью зависит от вас (что мне нравится в Backbone).Так что вы просто измените его на: 

SearchView = Backbone.View.extend({
    initialize: function(){
        this.render();
    },
    render: function(){
        // Compile the template using Handlebars
        var template = Handlebars.compile( $("#search_template").html() );
        // Load the compiled HTML into the Backbone "el"
        this.el.html( template );
    }
});

Поскольку вы используете require.js, вы можете сделать Handlebars зависимостью в верхней части вашего модуля.Я довольно новичок в этом, но похоже, что обучение будет сосредоточено на Backbone.js шаблонах и require.js использовании.

2 голосов
/ 10 января 2016

Я бы предпочел скомпилировать шаблон один раз (во время инициализации), чтобы избежать перекомпиляции шаблона при каждом рендеринге.Кроме того, вам нужно передать модель в скомпилированный шаблон, чтобы сгенерировать HTML: 

SearchView = Backbone.View.extend({
  initialize: function(){
    // Compile the template just once
    this.template = Handlebars.compile($("#search_template").html());
    this.render();
  },
  render: function(){
    // Render the HTML from the template
    this.$el.html(this.template(this.model.toJSON()));
    return this;
  }
});
1 голос
/ 22 июня 2012

Если вы используете require.js, вы не сможете использовать текущий файл Handlebars. Я использовал следующий плагин Handlebars , и он, кажется, обновляется до текущей версии. Просто замените файл Handlebars на плагин выше, если Handlebars возвращает нуль в вашем модуле.

0 голосов
/ 22 марта 2017 
define(["app", "handlebars",
    "text!apps/templates/menu.tpl"
], function (app, Handlebars, template) {

    return {
        index: Marionette.ItemView.extend({
            template: Handlebars.compile(template),
            events: {
                'click .admin-menu-ref': 'goToMenuItem'
            },
            goToMenuItem: function (e) {
               //......
            }
        })
    }
});


 new view.index({model: models});
...