2012-01-04 83 views
6

我试图从里面有标签的标签列表中创建一棵树。小胡子+嵌套对象

下面是我使用的JSON的示例:

{ 
    "tags": 
    [{"name":"My first tag", 
    "tags": 
    [{"name":"My first tag inside a tag"}, 
    {"name":"My second tag inside a tag"}] 
    }] 
} 

如果我用下面的胡子模板,它会显示“我的第一个标签”没有任何问题:

<ul> 
{{#tags}} 
<li tag-id="{{id}}"> 
    {{name}} 
</li> 
{{/tags}} 
</ul> 

但随后,使用以下模板,我试图在第一个标记内显示标记:

<ul> 
{{#tags}} 
<li tag-id="{{id}}"> 
    {{name}} 
    <div> 
    {{#tags}} 
    <a>{{name}}</a> 
    {{/tags}} 
    </div> 
</li> 
{{/tags}} 
</ul> 

使用这个模板,小胡子不会渲染任何东西。

如何使用小胡子显示嵌套列表?

回答

7

为了解决这个问题,我会做:

<div id="result-tag"></div> 
<script language="javascript" type="text/javascript"> 
    function test(){ 
    var view = { 
    "tags": 
    [{"name":"My first tag", 
     "tags": 
     [{"name":"My first tag inside a tag"}, 
     {"name":"My second tag inside a tag"}] 
    }] 
    }; 

    var templt = '<ul>{{#tags}}<li>{{name}}<div>{{>subtags}}</div></li>{{/tags}}</ul>'; 
    var partials = {"subtags": "{{#tags}}<a>{{name}}</a><br/>{{/tags}}"}; 
    var html = Mustache.to_html(templt, view, partials); 
    document.getElementById('result-tag').innerHTML=html; 
} 
window.onload = test; 
</script> 

我希望帮助

+0

今天我来试试,我会尽快给你!谢谢。 – 2012-01-05 10:15:32

+0

太棒了! 我真的有一个问题,因为我使用$('#my-template')。html(),它用“>”代替“>”,我不得不使用replace('>','>') – 2012-01-05 21:35:28