Я пытаюсь ускорить свое приложение на основе jQuery Mobile и backbone.js, особенно ту часть, когда оно улучшает элементы формы (а их много). Я подумал, что мог бы позволить jQM «предварительно улучшить» шаблоны форм, а затем скомпилировать функцию шаблонов с улучшенной разметкой вместо того, чтобы улучшать все элементы формы при отображении каждой страницы. Это работало нормально, пока я не установил флажки с установленными/снятыми флажками. Шаблон в основном выглядит так:
<form>
<fieldset data-role="controlgroup">
<legend>{{legend}}</legend>
{{#items}}
<label for="{{id}}">{{#name}}{{name}}{{/name}}{{^name}}No name given{{/name}}</label>
<input type="checkbox" id="{{id}}" {{#checked}}checked{{/checked}}>
{{/items}}
</fieldset>
</form>
Когда я определяю свою функцию шаблона в Backbone-View, я пытаюсь сделать следующее:
var preEnhance = $('<div>').hide().html($('#tmpl').html()).appendTo($('body')).trigger('create');
return Mustache.compile(preEnhance.html());
Я хотел бы использовать его против таких данных:
{legend: 'Pre Enhanced Forms, How?', items:[{id:'a',name:'A', checked: true},{id:'b',name:'B'},{id:'c'}]}
Тем не менее, jQuery Mobile делает что-то странное с частью {{#checked}}checked{{/checked}}
: она превращается в {{#checked}}checked{{="" checked}}=""
, что, я думаю, связано с /
, которую jQM интерпретирует как начало закрывающего тега (поправьте меня, если я ошибаюсь). И вот так я больше не могу отображать шаблон.
Могу ли я что-то с этим сделать? Я делаю что-то неправильно? Есть ли лучший способ использовать предварительно расширенные шаблоны? Я бы не хотел заходить так далеко, чтобы использовать расширенную и жестко запрограммированную разметку в своих шаблонах.
Также есть (неудачная) демонстрационная скрипка для тех, кто заинтересован.