版权所有,转载请注明出处:http://guangboo.org/2014/01/01/surgejs-with-tag
Surge.js更新0.2.3 Alpha版本,添加对with标记的支持,去掉模板中context引用,并且修复if标记的bug。
去掉context
surge.js将模板编译成js函数,该函数接收一个context参数,因此,模板中的变量必须是context中属性,写法如:
{% for item in context.products %}
新版本将不需要在模板中直接引用context,只需要写成:
{% for item in products %}
添加with标记
新版本添加了with标记,与js中的with语句不同,surge.js的with标记类似于给变量重新取个名字,如:
{% with total = products.length %} {{ total }} {% endwith %}
其代码与下面代码功能一致:
{{ products.length }}
并且with标记支持定义多个变量,使用空格或“,”分隔,如下:
{% with total = products.length ps = products %}{% endwith %}
或者
{% with total = products.length, ps = products %}{% endwith %}
if标记
if标记支持多种形式,例如:
如下语句表示products是否为空,如:null, [], false, ''等。
{% if products %}{% endif %}
如下代码更js的判断语句类似,其效果同上:
{% if products.length > 0 %}{% endif %}
如下语句将转换成js代码:
{% if 0 < product.length < 10 %}{% endif %} {% if 0 < product.length and products.length > 0 %}{% endif %}
转换成js代码,如下:
if(0 < products.length < 10){} if(0 < products.length && products.length > 0){}
更复杂的if标记,允许带filter,如下:
{% if products.length > 0 and products|somefilter:"argument" > 0 %}{% endif %}
将转换成js代码:
if(products.length > 0 && somefilter(products, "argument") > 0){}