Шаблон Underscore.js с ошибкой Backbone.js

Question

Строка ниже полностью не работает.

template: _.template($('#test').html()), 

Попытка следовать простой пример из https://github.com/ccoenraets/backbone-jquerymobile использовать JQuery мобильный телефон вместе с Backbone.js. Ошибка, которую я получаю в веб-инспекторе: TypeError: «null» не является объектом (оценивающим «str.replace»), который находится в строке 913 underscore.js. Используя это _.template таким образом:

template: _.template("<h1>To Do</h1>"), 

работы, но для того, чтобы включить мобильные стили JQuery, таким образом, не будет делать.

todo.js

TodoBb.Views.ComCentersTodo = Backbone.View.extend({ 

template: _.template($('#test').html()), 


render: function() { 
    $(this.el).html(this.template()); 
    return this; 
} 
}); 

main.html

<script type = 'text/template' id = 'test'> <h1>To Do</h1> </script> 

Answer 1

DOM-не готов, когда ваше мнение разбираемый:

TodoBb.Views.ComCentersTodo = Backbone.View.extend({ 
    template: _.template($('#test').html()), 
    //... 
}); 

так $('#test').html() является null и вы Фактически это делает:

TodoBb.Views.ComCentersTodo = Backbone.View.extend({ 
    template: _.template(null), 
    //... 
}); 

Внутренние элементы _.template используют replace при преобразовании шаблона в функцию JavaScript.

У вас есть несколько вариантов:

1. Поместите TodoBd.Views.ComCentersTodo определение внутри $(document).ready() обработчика:

   $(function() { 
       TodoBb.Views.ComCentersTodo = Backbone.View.extend({ 
        template: _.template($('#test').html()), 
        //... 
       }); 
   }); 
   

2. Не компилировать шаблон, пока он не понадобится:

   TodoBb.Views.ComCentersTodo = Backbone.View.extend({ 
       //... no template in here 
       render: function() { 
        var html = _.template($('#test').html(), this.model.toJSON()); 
        this.$el.html(html); 
        return this; 
       }, 
       //... 
   }); 
   

В качестве варианта вы можете кэшировать скомпилированные функции шаблона где-нибудь и только вызывать _.template($('#test').html()) при первом использовании.