JS中art-template模板使用过滤器

6 篇文章 1 订阅

html有个特点:某些小数会变成无限小数。
比如1.05,可能显示为1.049999999999……

在javascript中可以使用.toFixed(value);等方法,进行四舍五入处理,保留固定的小数位数。

但是,art-template模板进行渲染就不支持在模板中直接使用方法。
这时就需要用到art-template模板的过滤器。
语法:

	<!--HTML-->
	<script type="text/html" id="template">
		{{date|过滤器名称}}
	</script>
	template.defaults.imports.过滤器名称 = function(date){
	    处理内容
	    return 处理结果
	};

举个栗子:

	<div class="box"></div>
	<script type="text/html" id="template">
		<div class="total-price">
			{{list.unit-price*list.num|format}}</div>
	</script>
	render(data){
		// art-template过滤器
		template.defaults.imports.format = function(n){
			return n.toFixed(2);
		};
		// art-template模板渲染
		$(".box").html(template('template',{list:data}));
	}

效果图:
原本:
在这里插入图片描述
使用过滤器:
在这里插入图片描述

需要注意的是过滤器必须有一个返回值。
并且过滤器还有其他写法。

  • 3
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值