XTemplate是一个javascript组件，主要是用于完成html页面上数据的绑定。常用的方式是用ajax从远程读取数据，XTemplate会将这些数据按规则绑定到页面的dom上去。它支持两种绊绑定方式，绑定数组和绑定对象。简单的说一个用于显示列表，另一个用于显示一般内容。
单变量绑定
是以html中data-bind标记为绑定对象，只要data-bind的内容和绑定的变量同名，即会自动赋值。
例如：
<p data-bind='title'></p>
这时如果有一个变量为如下结构{title:'hello world'}，那么，这个name为title的p标签就会显示hello world。
最终会生成
<p data-bind='title'>hello world</p>
使用方法参见示例：
1.普通绑定：输出到p的默认内容中，此处为innerHTML属性。一般img将输出到src，input输出到value，其它输出到innerHTML。
<p data-bind="content"></p>
2.原始值按html输出：
<p data-bind="content" data-bind-to="innerHTML"></p> 或 <p data-bind="content" data-bind-to="innerHTML">{!content}</p> 第1种为简写，第2种为data-bind-to的标准写法
3.data-bind-to使用：
<b data-bind="market_product_id" data-bind-to="title" title="{!content}">title</b> data-bind-to指定了输出的属性，所以将绑定的内容将按data-bind-to进行绑定。此处data-bind-to为title，
待绑定的属性内容要使用模板。
所以XTemplate将会把market_product_id的值绑定到title属性上。
此处模板内content前有个叹号“！”，代表输出原始值，不进行html转义。
4.模板输出：必须使用data-bind-to指定属性名，默认的输出属性值不会当作模板。
<p data-bind="content" data-bind-to="innerHTML"><b>{content|default,'没有内容显示'}</b></p> content的内容会以内部html为模板绑定后显示
如果content为空，最终输出 <p data-bind="content" data-bind-to="innerHTML"><b>没有内容显示</b></p> 如果刚开始不想显示出模板的内容，可以将p设置为隐藏 <p style="display:none" data-bind-to="innerHTML" data-bind="content"><b>{content|default,'没有内容显示'}</b></p> 或 <p class="hide" data-bind-to="innerHTML" data-bind="content"><b>{content|default,'没有内容显示'}</b></p> 绑定后style.display将被重置为空，css中的hide也会被移除。
5.img的src绑定：
<img data-bind="thumb"/> 最终输出<img data-bind="thumb" src="图片地址"/> 指定img的默认显示图片，直接使用原来的src指定默认图 <img data-bind="imgsrc" data-bind-src='/{imgsrc}/abc.jpg' src='默认图'/> 如果img的地址比较复杂，是组合而成，或是需要用函数，可以使用data-bind-src来指定src的模板。 <img data-bind="thumb" data-bind-src="{thumb1|default,'logo.jpg'}"/> 注意不要用src属性！！！
不使用data-bind-to指定src，是因为如果指定img的src，将会使浏览器多产生一个无效的http请求，影响加载效果。
错误的例子：<img data-bind="thumb" data-bind-to="src" src='/{imgsrc}/abc.jpg'> /{imgsrc}/abc.jpg这个地址是不存在的地方，所以会引起一个错误的http请求。
数组绑定
数组绑定是指定一个模板，并把数组的内容循环，按模板格式化后返回多行html。
例如：
<ul data-repeat-name='listdata'> <li>{title}</li> </ul>
这里定义了一个名为listdata的模板，ul的内部html将成为可循环的模板，即
<li>{title}</li>
为待循环的内容
我们绑定以下变量[{title:'hello 0'},{title:'hello 1'}]
最终会生成
<ul data-repeat-name='listdata'> <li>hello 0</li> <li>hello 1</li> </ul>
使用方法参见示例：
1.普通输出：
<ul data-repeat-name='data'> <li>{market_product_id}:{product_name}</li> </ul>
2.img的src绑定：
<ul data-repeat-name='data'> <li><img data-bind-src='{thumb}'/>{market_product_id}:{!content}</li> </ul> 这里与单变量绑定不同的是没有使用data-bind指定绑定的属性，其它使用方法完全一致。
模板的使用
模板的基本语法是{模板内容}，两端以大括号包围，中间为模板的内容。
如：{username}，即输出变量username的内容。
模板可以在循环的模板中使用，也可以在待绑定属性中使用，也可以在data-bind-src中使用。
使用方法参见示例：
1.使用内部函数处理输出结果：
{market_product_num|repeat,'*'}//最终输出market_product_num个*，repeat为内部函数 语法为：[属性名]|[函数]|[函数] 属性名后竖线"|"连接函数名，当前的属性必须为函数的第1个参数。 多个函数时依次用竖线连接，前一个函数作为后一个函数的第一个变量输入。 如：{user_money|format_money}，其中user_money为绑定属性名，format_money为内部函数名，主要作用为格式化货币。 如果函数有多个参数，使用逗号连接。
2.使用外部函数处理输出结果：
{market_product_id|#hello,':)'} 函数名前加了#号，代表使用外部函数，此处使用了hello，该函数使用前一定要定义。 此处market_product_id的值会传给s变量，即第1个变量。 示例1： function hello(s){ return s+' hello'; } 示例2： function hello(s,v){ return s+'hello'+v; }
3.使用多个函数处理输出结果：
{market_product_id|repeat,'@@'|#hello,':)'} 用|连接即可。
4.使用外部变量：
{id}={#out_abc} 变量前加#
5.进行简单的运算：
{market_product_id * 3 + 12} 在模板中，属性名支持简单的加减乘除运算，复杂的请使用自定义函数处理。
6.在模板中处理子循环：
{list|range,'ID:(id) '} 使用内部函数range，参数为模板内容。但为了区分子模板和主模板，子模板使用小括号“()”代替大括号。
特殊语法：
!号的使用
在模板中使用，例如{!title}，输出title的值，以没有!的区别，这里不会把html进行编码，会输出原始的html。
#号的使用
在函数名中使用，如果在函数名前加#，则指定这个函数为全局函数，这时这个函数必须是已经定义好的全局函数或是javascript的内部函数。 在变量名中使用，如果果变量名前加#，则指定这个变量为全局变量，这时这个变量必须是已经定义好的全局变量。
-
XTemplate的运行主体，对外使用的变量有$scope，当使用bindData时，变量会按绑定名字注入这个变量。 目前支持两种形式的绑定，单变量绑定和数组。 单变量绑定 是以html中data-bind标记为绑定对象，只要data-bind的内容和绑定的变量同名，即会自动赋值。 例如： <p data-bind='title'></p> 这时如果有一个变量为如下结构{title:'hello
-
Ext XTemplate的应用： template.js Ext.onReady(function(){ //定义模板 使用标签tpl和操作符for var tpl1 = new Ext.XTemplate( '<table border=1 cellpadding=0 cellspacing = 0>',
-
Ext.XTemplate 用法 1 自动填充数组和作用域切换： Ext.onReady(function(){ var tpl=new Ext.XTemplate( '<table border=1>', '<tr><td>姓名</td><td>年龄</td><td>操作</td></tr>', '<tpl for=".">',
-
Ext.application({ name: 'Fiddle', launch: function() { Ext.define('My.Example', { extend: 'Ext.Panel', tpl: new Ext.XTemplate( '<table border=\
-
2.在views目录添加test.xtpl文件，其内容为 this is {{title}}! 4.集成到Express中，只需要在app.js中，设置模板引擎即可 代码放入app.js的require 声明代码段下边 app.set('view engine','xtpl'); //此行代码放入app.js的app.set代码段下边 app.use('/ooxx',print); //此行代码放
-
1. template 是什么 template 是一个 HTML 片段的模板，它可以进行预编译从来提升性能。 2. Xtemplate Xtemplate 继承自 template,Xtemplate 支持以下这些功能： 1.数组 1) 如果给定的是个数组，他会自动填充，为数组总每一项重复 template 中的 block。 2) for=“.” ，会从根节点开始重复，for=“record”
-
renderer : function(value, cell, record, rowIndex, colIndex){ var qtipTpl = new Ext.XTemplate( '<tpl for=".">', '<div ext:qtip="{dat
-
2016年12月25日 重庆-传说 http://blog.csdn.net/zdb330906531 var testTpl = new Ext.XTemplate([ '<tpl for="test">{[fm.date(new Date(parseInt(values.datatime)*1000),"Y-m-d")]}</tpl>' ]); //values你可以理解为每次循环的数据，而这
-
currentControl.balanceResultTpl +='<div class="<tpl if="BALANCE_PACK > 0">summary-qty-style-red">+{'+BALANCE_PACK+'}/<tpl else><tpl if="BALANCE_PACK === 0">summary-qty-style">{'+BALANCE_PACK+'}/<tp
-
Ext.onReady(function(){ Ext.onReady(function(){ //定义模板 使用标签tpl和操作符for var tpl1 = new Ext.XTemplate( '<table border=1 cellpadding=0 cellspacing = 0>', '<tr><
-
迁移到androidx后 我在编译时遇到问题 错误：找不到符号androidx。数据绑定。数据绑定组件 符号：类DataBindingComponent位置：包androidx。数据绑定 im使用的Gradle版本为5.4.1 注：androidx中的其他组件。数据绑定包工作正常。像DataBindingUtil 只有DataBindingComponent不工作
-
数据绑定 JXML 中的动态数据来自于该 Page 的 data字段。 简单绑定 数据绑定使用 Mustache 语法（双大括号）将变量包起来，可以作用于以下： 页面内容 <view> hello {{ name }} </view> Page({ data: { name: 'cortana' } }) 组件属性(需要在双引号之内) <view id="{{id}}"> </
-
attr绑定是用来为html元素绑定属性值的，这种绑定非常有用，例如我们需要想一个元素添加title属性，或者为img标签添加src属性。 示例代码： //.W片段 <a bind-attr="{ href: url, title: details }"> Report </a> //js片段 this.url=justep.Bind.observable("year-end.html"),
-
submit绑定只能用在form元素中，当form提交的时候被触发，并且默认阻止form的提交。因此我们通常在submit的处理函数中以ajax的方式提交form表单。 示例代码： //.W片段 <form bind-submit="doSomething"> ... form contents go here ... <button type="submit">Submit</butt
-
with绑定用来创建一个绑定上下文，在子元素内的所有绑定都在这个上下文中进行。 示例代码： //.W片段 <h1 bind-text="city"> </h1> <p bind-with="coords"> Latitude: <span bind-text="latitude"> </span>, Longitude: <span bind-text="longitude"> </span
-
foreach绑定用来处理数组，通常用来将一个数组绑定到一个列表或者table中。在foreach绑定中，我们可以使用if、with等嵌套绑定。 示例代码： //.W片段 <table> <thead> <tr><th>First name</th><th>Last name</th></tr> </thead> <tbody bind-foreach="people"> <tr>
-
selectedOptions绑定用在select元素中，用来绑定已选中的对象，通常被用在多选列表中。如果列表为单选列表（下拉列表），选中值可以用value绑定。 示例代码 //.W片段 <p> Choose some countries you'd like to visit: <select bind-options="availableCountries" bind-selectedO
-
options绑定用来绑定select控件的option项，它只能用在select元素中，并且绑定值必须为数组。对于单选的下拉列表，选中值用value绑定；对于多选的列表，选中值用selectedOptions绑定。 示例代码 单选列表 //.W片段 <p> Destination country: <select bind-options="availableCountries"></se