灰尘 - 通过json数据循环

我非常卡在这里。我使用灰尘作为模板编译器，但无论什么原因，我只从我的JSON中返回一个值，它不会循环并返回所有内容。所以我得到的是“DWade”关于发生什么事情的任何想法？粉尘新手所以代码示例真的很有帮助。灰尘 - 通过json数据循环

JSON：

{ 
"locations": [ 
{ 
    "userName": "MKelly", 
    "hours":"9-5" 
}, 
{ 
    "userName": "MReynolds", 
    "hours":"10-2" 
}, 
{ 
    "userName": "DWade", 
    "hours":"9-9" 
} 
] 
}

这里是我的jQuery：

var compiled = dust.compile($('.dust-info').html(), "tmp_skill"); 
dust.loadSource(compiled); 

    $.getJSON("/services/userInfo?" + userTypes, function(data) {  
     $.each(data.locations, function(key, val) { 
     dust.render("tmp_skill", val, function(err, out) { 
     //HTML output 
     $('.dust-info').html(out); 
     }); 
    });

模板：

<div class="dust-info"> 
    {userName} 
    {hours} 
</div>

来源

2014-05-22 Delmon Young

我从来没有真正使用的防尘过，但希望我能有点帮助。

首先，你是每次穿过$.each时间变化的.dust-信息的innerHTML清除内.dust-信息

一切

尝试以此为模板

{#locations} 
    <div class="dust-info"> 
     {userName} {hours} 
    </div> 
{:else} 
    No Location 
{/locations}

尝试一下这里http://akdubya.github.io/dustjs/ - 将模板粘贴到1并将模板数据粘贴到3中。

不要忘记，在使用它之前，您需要先编译模板。

你应该能够做到这一点之后

dust.render("tmp_skill", data.locations, function(err, out) { 
    //append generated output to body 
    $(body).append(out); 
})

这个例子就追加输出到身体

来源

2014-05-22 23:20:07

谢谢，你发送的东西似乎工作，但是我的代码有什么问题？当我尝试将它添加到我的时候，我仍然只得到一个结果。 –

检查我编辑的答案 –

太棒了！非常感谢！ –

与andyw以上您的意见，你有1分的结果，因为在JavaScript代码，您使用这个：$（'。dust-info'）。html（out）;使用.html（out）：：js将会找到class'dust-info'的标签，然后循环data.locations并且仍然替换这个标签的html，不会追加 - 或者显示为列表，所以这就是为什么你只看到1结果。 andyw的回答是在尘埃模板中循环数据和显示数据列表的最佳方式。

来源

2014-06-13 03:18:25 kate

灰尘 - 通过json数据循环

回答

相关问题