How to use tmpl - 10 common examples
To help you get started, we’ve selected a few tmpl examples, based on popular ways it is used in public projects.
Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
heeroluo / jraiser / calendar / 1.0.x / index-debug.js View on Github 
render: function(settings) {
var t = this, options = t._options;
// 创建数据模型
if (t._model) {
t._model.month(settings.month);
t._model.year(settings.year);
} else {
t._model = new CalendarModel(settings.year, settings.month);
}
var data = t._model.build(settings.selectedDates);
options.wrapper.empty().html(
tmpl.render(options.template, {
weekDayNames: options.weekDayNames,
data: data
})
).find('td').click(function(e) {
e.preventDefault();
var date = new Date( parseInt( this.getAttribute('data-timestamp') ) );
/**
* 选择月历中的某一天时触发
* @event dayselect
* @for Calendar
* @param {Object} e 事件对象
* @param {Date} e.selectedDate 被选择那一天的日期对象
* @param {Element} e.dayGrid 被点击的日期格子
*/
t.trigger('dayselect', {
selectedDate: date,_init: function(options) {
var t = this, wrapper = options.wrapper;
if (!wrapper) { return; }
// 写入分页条HTML
wrapper.empty().html( tmpl.render(options.template, {
currentPage: options.currentPage,
totalPages: options.totalPages,
pageNumbers: t._build(),
nextText: options.nextText,
prevText: options.prevText,
ellipsisText: options.ellipsisText
}) );
/**
* 点击分页条中的链接时触发
* @event click
* @param {Object} e 事件参数
* @param {Number} e.page 页码
* @for Paginator
*/
wrapper.find('a').click(function(e) {_init: function(options) {
var t = this;
// 写入分页条HTML
t._$paginator = $( Tmpl.render(options.template, {
currentPage: options.currentPage,
totalPages: options.totalPages,
pageItems: t._build(),
nextText: options.nextText,
prevText: options.prevText,
ellipsisText: options.ellipsisText
}) ).appendTo(options.$appendTo);
t._$paginator.on('click', function(e) {
e.preventDefault();
/**
* 点击分页条中的链接时触发
* @event click
* @param {Object} e 事件参数
* @param {Number} e.page 页码
* @for Paginator_add: function(result) {
var t = this, col = t._cols.length - 1;
var html = tmpl.render(t._options.template, result);
if (!html) { return; }
var grids = $(html).css('position', 'absolute');
if (stylePrefix != null) {
grids.css({
top: t._cols[col],
left: (t._gridWidth + t._colSpacing) * col
});
}
html = null;
t._wrapper.append(grids);
/**
* 格子添加到页面上时触发（此时格子中的图片可能没加载完）_add: function(result) {
var t = this, col = t._cols.length - 1;
var html = tmpl.render(t._options.template, result);
if (!html) { return; }
var grids = $(html).css('position', 'absolute');
if (stylePrefix != null) {
grids.css({
top: t._cols[col],
left: (t._gridWidth + t._colSpacing) * col
});
}
html = null;
t._wrapper.append(grids);
/**
* 格子添加到页面上时触发（此时格子中的图片可能没加载完）}
catch (e) {
}
accConfig[acc][split[1]] = value;
}
});
AppProperties.set("LOGIN_ACCOUNTS_CONFIG", accConfig);
}
//cache configs
AppProperties.set("GLOBAL_CACHE_STORE", props["global.cache.store"]);
AppProperties.set("DEFAULT_CACHE_EXPIRE", eval(props["default.cache.expire"])); //evals the string to int
AppProperties.set("DB_CACHE_STORE", props["db.cache.store"]);
AppProperties.set("BOTTOM_SCRIPTS_CACHE_STORE", props["bottom.scripts.cache.store"]);
AppProperties.set("TMPL_CACHE_STORE", props["tmpl.cache.store"]);
AppProperties.set("CACHE_REDIS_HOST", props["cache.redis.host"]);
AppProperties.set("CACHE_REDIS_PORT", props["cache.redis.port"]);
props["show.plugin.view.permission.error"] &&
AppProperties.set("SHOW_PLUGIN_VIEW_PERMISSION_ERR", JSON.parse(props["show.plugin.view.permission.error"]));
//error templates
AppProperties.set("APP_404_ERROR_TMPL", props["app.404.error.tmpl"]);
AppProperties.set("APP_500_ERROR_TMPL", props["app.500.error.tmpl"]);
AppProperties.set("APP_401_ERROR_TMPL", props["app.401.error.tmpl"]);
AppProperties.set("PLUGIN_ERROR_TMPL", props["plugin.error.tmpl"]);
}define(function(require, exports, module) { 'use strict';
/**
* 月历组件
* @module calendar/1.1.x/
* @category Widget
*/
var base = require('base/1.1.x/'),
$ = require('dom/1.1.x/'),
Tmpl = require('tmpl/2.1.x/'),
widget = require('widget/1.1.x/');
var tmpl = new Tmpl({
table:
'>' +
'<% if (weekDayNames) { %>' +
'' +
'' +
'<% weekDayNames.forEach(function(name) { %>' +
'' +
'<% }); %>' +
'' +
'' +
'<% } %>' +
'' +
'<% weeks.forEach(function(week) { %>' +
'' +<table class="ui-calendar"><thead class="ui-calendar__head"><tr><th class="ui-calendar__head__grid">' +
'<span class="ui-calendar__head__grid__inner"><%=name%></span>' +
'</th></tr></thead><tbody class="ui-calendar__body"><tr></tr></tbody></table>define(function(require, exports, module) { 'use strict';
/**
* 模拟选择框组件
* @module selectmenu/1.1.x/
* @category Widget
*/
var widget = require('widget/1.1.x/'),
Tmpl = require('tmpl/2.1.x/'),
$ = require('dom/1.1.x/'),
Scrollbar = require('scrollbar/1.1.x/');
var tmpl = new Tmpl({
SELECTMENU:
'<div class="ui-selectmenu">' +
'<div class="ui-selectmenu__button">' +
'<span class="ui-selectmenu__button__text"><%=defaultText%></span>' +
'<span class="ui-selectmenu__button__icon"></span>' +
'</div>' +
' name="<%=name%>"<% } %> type="hidden" />' +
'<div style="display: none;" class="ui-selectmenu__layer">' +
'<div class="ui-selectmenu__layer__inner">' +
'<ul class="ui-selectmenu__menu"></ul>' +
'</div>' +
'</div>' +
'</div>',
MENU_ITEMS:
'<% data.forEach(function(d) { %>' +export function processText (dialogNode, context, wrap = true) {
let text = utils.i18n(dialogNode, 'text')
text = tmpl(text || '', context)
if (!text) {
return undefined
}
if (wrap) {
return wrapText(`<div>${text}</div>`)
}
return text
}define(function(require, exports, module) { 'use strict';
/**
* 模拟选择框组件
* @module selectmenu/1.0.x/
* @category Widget
*/
var widget = require('widget/1.0.x/'),
Tmpl = require('tmpl/2.0.x/'),
$ = require('dom/1.0.x/'),
Scrollbar = require('scrollbar/1.0.x/');
var tmpl = new Tmpl({
SELECT_MENU:
'<div class="selectmenu">' +
'<div class="selectmenu-button">' +
'<span class="selectmenu-currenttext"><%=defaultText%></span>' +
'<span class="selectmenu-triangle"></span>' +
'</div>' +
' name="<%=name%>"<% } %> type="hidden">' +
'<div class="selectmenu-menu">' +
'<div class="selectmenu-menu-inner">' +
'<ul class="selectmenu-options"></ul>' +
'</div>' +
'</div>' +
'</div>',
OPTION_ITEMS:
'<% data.forEach(function(d) { %>' +
