kendoUI模板引擎： #号语法（hash语法）

kendoUI中的模板引擎使用的语法叫做#号语法，或者hash syntax（哈希语法）。

它的主要作用是:

• 渲染数据和执行js表达式

1. 渲染数据到html模板

• 第一种：使用=号渲染原始值
#= myVar #
• 第二种：使用:号渲染html编码值
#: myVar #
• 两者的区别：
  当数据值中包含HTML标签时，冒号方式会对值里的HTML标签进行转义，从而可以把标签作为字符串直接输出。

区别示例：

//uses #= #
var myTemplateRaw = kendo.template("
#= name #
");
var newHTMLRaw = myTemplateRaw({name:"zmh"});
console.log(newHTMLRaw); //
zmh
$("#container").append(newHTMLRaw);

//uses #: #
var myTempalteHTMLEncoded = kendo.template("
#: name #
");
var newHTMLEncoded = myTempalteHTMLEncoded({name:"zhouminghang"});
console.log(newHTMLEncoded); //
<strong>zhouminghang</strong>
$("#container").append(newHTMLEncoded);

页面结果：

zmh
zhouminghang

很明显，=号过滤掉了html标签，但：号会将html标签作为字符串输出。

2. 执行js表达式 # expression

• 示例1：

• 示例2：

var template = "#if(foo) {# #= foo # is true #}#";

• 示例3：

无论是在行内模板中，还是在外部模板中，都可以使用JS变量和表达式。

• 注意：
  js表达式中都要以#开头，以#结束，注意单双引号的嵌套，一般为外双内单。
  如果表达式中存在 #号特殊字符，比如style中颜色用#号值，注意使用双斜杠\\，进行转义，不是单斜杠，否则会报无效的模板错误。

---

3. KendoUI是一套很棒的HTML5开发控件，它的优点是控件齐全，功能强，易于学习，使用代码简练。

3.1 基本使用方法：

1.通过$().kendoXXX将普通的HTML控件转化为Kendo控件；

2.通过设置控件dataSource和服务端进行数据交互；

3.通过控件的Method和Configuration来操作和配置控件。

3.2 更多kendoUI知识，请参考kendoUI官网上的示例文档：

• http://demos.telerik.com/kendo-ui/

• http://docs.telerik.com/kendo-ui/api/javascript/ui/splitter