jquery - 如何用jquery实现递归模板

标签 jquery templates recursion jquery-templates

我从数据库获取一个 json,然后动态加载模板并应用该 json。该变量中存储的数据是自引用的(典型的 id -parent_id)。 我无法对该数据进行递归。

json:

var my_json = {"modules":[
    {
        "id_modules": "1",
        "id_modules_parent": "0",
        "mod_name": "mod 1",
        "sub_modules": [
            {
                "id_modules": "2",
                "id_modules_parent": "1",
                "mod_name": "mod 1a",
                "sub_modules": ""
            },
            {
                "id_modules": "3",
                "id_modules_parent": "1",
                "mod_name": "mod 1b",
                "sub_modules": ""
            }
        ]
    },
    {
        "id_modules": "4",
        "id_modules_parent": "0",
        "mod_name": "mod 2",
        "sub_modules": [
            {
                "id_modules": "5",
                "id_modules_parent": "4",
                "mod_name": "mod 2a",
                "sub_modules": [
                    {
                        "id_modules": "7",
                        "id_modules_parent": "5",
                        "mod_name": "mod 2aa",
                        "sub_modules": ""
                    }
                ]
            },
            {
                "id_modules": "6",
                "id_modules_parent": "4",
                "mod_name": "mod 2b",
                "sub_modules": ""
            }
        ]
    }
]}

这就是我渲染模板的方式:

$.get("template_file.txt", function(template)
{
    $.tmpl(template, my_json).appendTo("#some_div");
});

最后是模板(template_file.txt):

<ul class="modules_ul">
    {{each(i, module) modules}}
        <li>${module.mod_name}</li>
        {{each(j, submodule) module.sub_modules}}

            {{tmpl(submodule) ".modules_ul" }} //what goes here?

        {{/each}}
    {{/each}}
</ul>

有人可以帮我吗?提前致谢!

编辑: 添加了jsfiddle玩玩

解决方案:请参阅 mblase75 在此 post 中的答案

最佳答案

应该是这样的

<ul class="modules_ul">
    {{each(i, module) modules}}
        <li>${module.mod_name}</li>
        {{if module.sub_modules}}
            {{tmpl(module.sub_modules) "template_name"}}
        {{/if}}
    {{/each}}
</ul>

关于jquery - 如何用jquery实现递归模板,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7248575/

相关文章:

jquery - 在加载时调整文本区域的大小

javascript - 在鼠标悬停时淡出图片,然后淡入不同的图片

c++ - 异构数组中的元素可以知道它是什么模板类型吗?

c++ - 具有任意参数的模板仿函数

c++ - 如何 tuple<Ts...>& base = t;在元组实现中工作

linux - ls -R忽略特定目录

javascript - JSZip:从文件输入中获取 zip 文件的内容

c++ - 内存泄漏可能是由于递归函数

javascript - 如何在 JavaScript 中删除嵌套对象树中的特定节点

javascript - sencha 日历错误未捕获类型错误 : Cannot read property 'indexOf' of undefined on page load