Я пытаюсь достичь того, чтобы хранить шаблоны HTML для всего, что должно быть сгенерировано на лету, в отдельном файле js (вместо рендеринга его на странице).
buildHtmlФункция, как его текущая настройка работает нормально.Я застрял в том, что, если ... У меня есть другая переменная внутри объекта шаблона с именем 'input3', и ее разметка выглядит примерно так: <div>(exact markup from commonInput)</div>
Я пытался использовать ее как input 3 : '<div>' + this.commonInput + '</div>', но получаетсяВы не можете ссылаться на свойства объекта изнутри, используя this (объяснено здесь) .
Я мог бы создать 'input3' с полным html, но для больших html-блоков этот подход не очень полезен.
В поисках
- решения этой конкретной проблемы
- причин, по которым такой подход плохая идея
лучшие альтернативы
$j(document).ready(function() {
var namespace = window.namespace || {};
namespace.feature = namespace.appName || {};
namespace.feature.templates = {
input1 : '<div>'+
'<p class="abc">Hey {username}</p>'+
'</div>',
input2 : '<div>'+
'<div class="description">{description}</div>'+
'</div>',
commonInput : '<div class="common">Common code</div>'
};
namespace.feature.module = function() {
var container = $j('#container'),
t = namespace.feature.templates;
var buildHtml = function(type) {
var tmpHtml = t.input1 + t.commonInput + t.input2;
container.append(tmpHtml);
}
var init = function() {
buildHtml();
}
return {
init : init,
};
}();
namespace.feature.module.init();
});