在使用 art-template.js 出现如下的场景:
比如,循环体外面定义变量,并且在循环体内改变变量的值 但我又不想让其显示出来。
那我们一步一步的来实现以上的场景 看看会出现什么神奇的地方。
1. 首先引入 template-web.js
2. 编写模板文件
<script id="template" type="text/html">
// 1. 定义变量 flag = false <br/>
{{set flag = false}}
// 2. 循环 <br/>
{{each target list i}}
{{each target list2 j}}
{{if(i==j)}}
// 3. 改变 flag 的值 <br/>
// 方案 1(扑街):{{flag = true}} <br/>
// 直接在模板中这样写“flag = true”,这样最终的值到是改变了,// 但是它也会在渲染过后显示在页面上。而我们只是想改变值而不想让其显示出来
//
// 方案二 (扑街):{{set flag = true}}
// 我的理解是循环的作用域 set 了一个局部变量,// 跟在循环体外面定义的 flag 是两个不同的变量
// 所以这个方式虽然没有让其显示,但是却没有改变循环体定义的 flag 的值 没有起作用
// 经过各种查询资料 似乎都没有找到解决方案,本打算就此放弃。// 通过各种尝试,并大胆推测:此模板是否支持“链式赋值”。自己也就尝试了一下。// 成功了,不得不感叹 art-template 模板的强大,还有狠多有待挖掘。// 记录一下,以免走弯路。// 方案三 (彩蛋):{{set flag1 = flag = true}}
{{set flag1 = flag = true}} // 关键一步 修改 flag 的值 而没有输出显示
{{/if}}
{{/each}}
{{/each}}
// 4. 输出 flag 值
{{flag}}
</script>
结果显示:
// 1. 定义变量 flag = false
// 2. 循环
// 4. 输出 flag 值
true
已此记录,方便交流