art-template简单使用

art-template是一款较通用的前端模板引擎。

具备3个要素

1）模板

    <script type="text/template" id="tpl">

        <p>我是一头{{animal}}</p>

    </script>

2）引入插件

    <script src="./template-web.js"></script>

3）调用插件

var html = template('tpl', {animal:"老虎" });

console.log(html)；

------------------------------------------------------------------------------------------------------

这个地方有一点需要注意：如果传入给template第二个参数的是一个没有次级对象的单层级对象,模板中只要包含属性名就好, 如

{animal："老虎"} => {{animal}}

{animals：{"cat":"老虎"， "dog":"狮子"}} => {{animals.cat}} | {{animals.dog}}

------------------------------------------------------------------------------------------------------

模板中的写法：

{{each target}}

    {{$index}} {{$value}}

{{/each}}

传入template的数据的格式

{"target":["aaa","bbb","ccc"]}
或
{"target":{a:"aaa",v:"bbb",c:"ccc"}

模板中的写法：

{{if age == "21"}}

   ....

{{else if age == "23"}}

    ....

{{/if}}

传入template的数据的格式

{"age":"23"}

{{@ data }}

详细信息可看art-template官网 http://aui.github.io/art-template/zh-cn/

巴特西