2013-03-30 95 views
0

我仍然忙於嘗試將JSON文件設置爲HTML網站。因此,如果json更改了動態加載的HTML。到目前爲止,我能夠檢索內容,甚至請求一些內容。但不是我想要的所有東西,因爲來自JSON的標記有點奇怪。Mustache.js迭代所有數組

由於跨站點保護,我無法直接執行JSOP請求,所以我用一個小技巧解決了我在某處看到的問題。我創建了一個簡單的test.php:

這樣我就繞過了跨站點保護,一切正常。唯一的問題是我無法遍歷所有我想要的數組。目前我使用以下腳本來執行JSOP調用並獲取數據。而輸出爲<li></li>

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8" /> 
</head> 
<body> 
    <ul id="episodes"> 
    </ul> 
    <script src="http://cdnjs.cloudflare.com/ajax/libs/mustache.js/0.7.0/mustache.min.js"></script> 
    <script src="http://ps3scenefiles.com/json/handlebars.js"></script> 
    <script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> 
    <script id="episodes-template" type="text/template"> 

      <li>{{description}}</li> 

    </script> 
    <script> 
     $(function() { 
      $.getJSON('http://ps3scenefiles.com/json/test.php', function(data) { 
       var template = $('#episodes-template').html(); 
       var info = Mustache.to_html(template, data); 
       $('#episodes').html(info); 
      }); 
     }); 
    </script> 
</body> 
</html> 

但是,當你打開鏈接到JSON(http://ps3scenefiles.com/json/test.php),你看到的情節的陣列具有帶只是數字另一個陣列之間的一個很好的說明。我怎樣才能創建像

Episode: 1 
    Id:13605 Active:true Lang:en Link: url 
    Id:16525 Active:true Lang:ru Link: url 
Episode: 2 
    Id:14854 Active:true Lang:en Link: url 
    Id:19445 Active:true Lang:ru Link: url 

所以要明確的清單,我該怎麼辦鬍鬚(或把手)模板,使它看起來像的例子嗎?

回答

0

您可以使用輔助把手如無定型在this answer

Here is a fiddle提到,打印出您所期望(排序的,不是所有的字段)的數據。

這裏是輔助函數 -

Handlebars.registerHelper('eachkeys', function(context, options) { 
    var fn = options.fn, inverse = options.inverse; 
    var ret = ""; 

    var empty = true; 
    for (key in context) { empty = false; break; } 

    if (!empty) { 
    for (key in context) { 
     ret = ret + fn({ 'key': key, 'value': context[key]}); 
    } 
    } else { 
    ret = inverse(this); 
    } 
    return ret; 
}); 
+0

您好,感謝您對這個答案。你可以告訴我,如果我想迭代,我必須在這個幫助者中更改:http://trendico.ru/api/moviebox/get_tv_data?id=1&season=1?我仍然需要相同的數據,但似乎情節是嵌套的。 – Senaxx

+0

情節似乎是相同的格式,請查看[小提琴](http://jsfiddle.net/SzAxf/2/)。我剛剛用新鏈接中的數據替換了劇集。 –

+0

謝謝。這意味着如果我使用整個JSON作爲輸入,我可以使用這個模板?我嘗試替換這個http://jsfiddle.net/SzAxf/3/小提琴中的JSON。但是到目前爲止沒有運氣:( – Senaxx