artTemplate--模板使用自定义函数(1)

案例


因为公司业务需要频繁调用接口,后端返回的都是json树对象,需要有些特殊的方法做大量判断和数据处理,显然目前简单语法已经不能满足业务需要了,需要自己定制一些
方法来处理业务逻辑。

例如后台返回的的json对象结构如下:

//数据
var data = {
	time: 1408536771253,
       queryRecord:{
       queryHistory:{
            overdue:[],
            query:{time:'100'},
            name:'fdsafdsa'
       }

    }
};

我想在页面显示的效果有数据时如下:
查询结果:逾期日期为 N ,预期次数为 N 次,查询次数为 N 次, 名字为:xxx

没有数据时,显示如下:
查询结果:查询成功,无记录

使用目前现有artTemplate的简单语法,如下:
{{if queryHistory==null || queryHistory.length==0|| queryHistory.overdue==null || queryHistory.overdue.length.length==0||queryHistory.query==null || queryHistory.query.length==0||queryHistory.name ==null || queryHistory.name.length==0}}
查询结果:查询成功,无记录
{{else}}
查询结果为:逾期时间为{{queryHistory.ovedue.date}},逾期次数为{{queryHistory.ovedue.time}},查询次数为{{queryHistory.query.time}},名字为:{{queryHistory.name}}{{/if}}

因为我不确定接口返回的数据是否有空值,我期望的结果应该是queryHistory下只要有属性是空的,我就希望显示最后查询结果为:“查询成功,无记录”,这样如果我使用原生的语法,我不得不做大量的判断,去判断我需要的属性是否会有空值,不然调用的时候会有异常


解决方案


我通过自定义一个函数去根据我业务需要去做判断,那样我就不需要在页面写大量代码了,只要我输入一个Json对象,它就给我返回是否有属性为空即可





helper-demo

    



辅助方法


注意:上面方法之所以用到全局变量,是因为我需要跳出递归,如果不使用全局变量去控制,那么递归时会导致每一个递归都会去执行,最后结果会有问题,因次我用到了一个exist变量作为退出递归的标志

页面输出结果如下:

artTemplate--模板使用自定义函数(1)_第1张图片



你可能感兴趣的:(Web前端)