Dot.js и Angular: есть ли способ стандартизировать HTML-шаблоны между фреймворками?
Веб-сайт DoT.js, показывает привязку или интерполяцию данных шаблона в виде
{{= it.modelFieldName }}
Угловые 2+ шоу
{{modelFieldName}}
Помимо замены строки перед использованием шаблона, как Dot.js может использовать {{modelFieldName}}
, удаляя = it.
а еще работаешь?
Причина: я хотел бы иметь единую директиву для создания шаблонов для наших дизайнеров, не являющихся программистами. Дизайнеры используют Adobe Illustrator для создания шаблонов, конвертируют с InkScape в SVG, затем программисты ссылаются на внешние шаблоны SVG в своей структуре шаблонов (некоторые используют Knockout.js с Dot, а некоторые используют Angular 2+.)
1 ответ
Имя этой конфигурации delimiters
,
Попробуйте настроить свой dot
следующее:
doT.templateSettings.interpolate = /\{\{([\s\S]+?)\}\}/g;
Источник: http://olado.github.io/doT/index.html
API
doT.templateSettings - настройки компиляции по умолчанию
Вы можете настроить DoT, изменив настройки компиляции. Вот настройки по умолчанию:
doT.templateSettings = { evaluate: /\{\{([\s\S]+?)\}\}/g, interpolate: /\{\{=([\s\S]+?)\}\}/g, encode: /\{\{!([\s\S]+?)\}\}/g, use: /\{\{#([\s\S]+?)\}\}/g, define: /\{\{##\s*([\w\.$]+)\s*(\:|=)([\s\S]+?)#\}\}/g, conditional: /\{\{\?(\?)?\s*([\s\S]*?)\s*\}\}/g, iterate: /\{\{~\s*(?:\}\}|([\s\S]+?)\s*\:\s*([\w$]+)\s*(?:\:\s*([\w$]+))?\s*\}\})/g, varname: 'it', strip: true, append: true, selfcontained: false };
Если вы хотите использовать свои собственные разделители, вы можете изменить RegEx в `doT.templateSettings` по своему вкусу.Вот список разделителей по умолчанию:
{{ }} for evaluation {{= }} for interpolation {{! }} for interpolation with encoding {{# }} for compile-time evaluation/includes and partials {{## #}} for compile-time defines {{? }} for conditionals {{~ }} for array iteration
По умолчанию на данные в шаблоне нужно ссылаться с помощью "it". Чтобы изменить имя переменной по умолчанию, измените настройку "varname". Например, если вы установите для "varname" значение "foo, bar", вы сможете передать 2 экземпляра данных и ссылаться на них из шаблона с помощью foo и bar.
Для управления пробелами используйте параметр "strip", true - для удаления, false - для сохранения.
'append' - это параметр оптимизации производительности. Это позволяет настроить производительность, в зависимости от используемого движка javascript и размера шаблона, это может привести к лучшим результатам с добавлением false.
Если "selfcontained" - true, doT создаст функции, которые не зависят от doT. Как правило, сгенерированные функции не зависят от doT, за исключением encodeHTML, и он добавляется только при использовании кодирования. Если "selfcontained" имеет значение true и шаблон требует кодирования, функция encodeHTML будет включена в сгенерированную функцию шаблона.