javascript - artTemplate如何循环这种数据结构
PHP中文网
PHP中文网 2017-04-11 11:58:38
[JavaScript讨论组]
{
    'a': {
        'propA1': 'valueA1',
        'propA2': 'valueA2'
    },
    'b': {
        'propB1': 'valueB1',
        'propB2': 'valueB2'
    }
    ....
}

如上数据结构,artTemplate这边要如何循环出来,我这边用each看官方文档没找着方法。

PHP中文网
PHP中文网

认证高级PHP讲师

全部回复(2)
PHP中文网

刚对着试了下,each可以直接用,key就是$index,value就是$value; 当然采取自己命名变量key跟value更好些。

如下:

var data = {
        data:{
        'a': {
            'propA1': 'valueA1',
            'propA2': 'valueA2'
        },
        'b': {
            'propB1': 'valueB1',
            'propB2': 'valueB2'
        }
    }
};
var str = '{{each data as dv dk}}{{dk}}:{\n {{each dv as val key}}{{key}}:{{val}}\n{{/each}} }\n{{/each}}';
var tmpl = template.compile(str);
tmpl(data);

update:

var data = {
        data:{
        'a': {
            'propA1': 'valueA1',
            'propA2': 'valueA2'
        },
        'b': {
            'propB1': 'valueB1',
            'propB2': 'valueB2'
        }
    }
};
//内嵌each不用as,也可以用$index跟$value,分别是key跟value
var str = '{{each data as dv dk}}{{dk}}:{\n {{each dv }}{{$index}}:{{$value}}\n{{/each}} }\n{{/each}}';
var tmpl = template.compile(str);
tmpl(data);
伊谢尔伦

可能遍历数组更加容易,数据要先手动转一下:

var dataArray = [
    {
        key: 'a',
        value: {
            'propA1': 'valueA1',
            'propA2': 'valueA2'
        }
    },
    {
        key: 'b',
        value: {
            'propB1': 'valueB1',
            'propB2': 'valueB2'
        }
    },
    ......
];

这样在模板上就可以遍历了:

{{each dataArray as data}}
    获取a/b/c/d:{{data.key}}
    获取a/b/c/d对应的propA1属性:{{data.value.propA1}}
    其他同理哦
{{/each}}

artTemplate很棒啊,我也在用,哈哈哈,希望对你有帮助。

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号