首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >Mustache.js遍历所有数组

Mustache.js遍历所有数组
EN

Stack Overflow用户
提问于 2013-03-30 10:04:32
回答 1查看 309关注 0票数 0

我仍然忙于尝试将JSON文件设置为HTML网站。因此,如果json发生更改,则会在HTML中动态加载更改。到目前为止,我能够检索内容,甚至可以请求一些内容。但并不是我想要的一切,因为来自JSON的标记有点奇怪。

由于跨站点保护,我不能直接执行JSOP请求,所以我用在某个地方看到的小技巧解决了这个问题。我已经创建了一个test.php,它可以简单地执行以下操作:

这样我就绕过了跨站点保护,一切都运行得很好。唯一的问题是我不能遍历我想要的所有数组。目前,我正在使用以下脚本执行JSOP调用并获取数据。输出很好地描述了<li></li>

代码语言:javascript
运行
复制
<!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)的链接时,您会看到剧集数组有另一个仅包含数字的数组。我如何创建一个列表,比如

代码语言:javascript
运行
复制
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

所以要清楚的是,我如何做一个胡子(或把手)模板,使它看起来像示例?

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2013-03-30 13:06:27

您可以使用this answer中提到的Handlebar helper

不带样式的Here is a fiddle,它打印出您期望的数据(某种程度上,不是所有字段)。

下面是helper函数-

代码语言:javascript
运行
复制
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
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/15714113

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档