遍历 Mustache JS答案

【问题标题】：Looping through Mustache JS遍历 Mustache JS
【发布时间】：2014-01-17 00:14:35
【问题描述】：

我无法从 JSON 获取数据以插入单个 div。我希望每个图像/视频网址都插入自己的

<div class="item"></div>

目前，每个对象都被插入到“item”类中（使用我给定的模板 HTML）。我认为必须告诉 Mustache 将数组中的每个对象插入到它自己的带有“item”类的 div 中，这样最终结果将是两个 div，每个 div 都包含模板中的 HTML。

我有 JSON 数据：

{ "pictures" : [
  {
    "image": "1",
    "videourl": "http://www.youtube.com/embed/"
  },
  {
    "image": "4",
    "videourl": "http://www.youtube.com/embed"
  }
]}

我有一个模板设置：

{{#pictures}}

    <div class="videoplay-main animated fadeIn" data-videourl="{{videourl}}">
        <img src="img/frontpage/{{image}}.jpg" />
    </div>

{{/pictures}}

我有 JS：

$.getJSON('js/data.json', function(data){
    var homeTemplate = $("#slider-template").html();
    var html = Mustache.render(homeTemplate, data);
    $('.item').html(html);
});

【问题讨论】：

标签： javascript jquery mustache

【解决方案1】：

那么你必须这样做：

{{#pictures}}
   <div class="item">
      <div class="videoplay-main animated fadeIn" data-videourl="{{videourl}}">
         <img src="img/frontpage/{{image}}.jpg" />
      </div>
   </div>
{{/pictures}}

【讨论】：

哇，不知道当它如此合乎逻辑时，我是怎么忘记的。迪米塔尔，我应该为这个而回避。
@James Nah dude :) 有时你盯着一个问题看太久，它总是发生在我身上。
感谢您的帮助和鼓励！太棒了。