Получение данных из Json и рендеринг в html (с начальной загрузкой) ajax call и усы - PullRequest
Новая
       27

Получение данных из Json и рендеринг в html (с начальной загрузкой) ajax call и усы

0 голосов
/ 08 мая 2018

Мой сайт построен с помощью начальной загрузки. Я хочу создать div с данными, хранящимися в файле JSON и рендеринг с усами. У меня есть скрипт внутри шаблона HTML для усов: 

<script id="plutos" type="text/template">
  <div class="col-sm-12 col-md-6 col-xl-4">
    <h3 class="text-center" >{{title}}</h3>
    <img src="{{picture}}" style="width:100%">
    <p class="text-justify" class="text-center">{{plot}}</p>
    <button  type="button" class="btn btn-primary btn-xs red">
      <i class="fa fa-fw fa-thumbs-up"></i> 
    </button>
  </div>
</script>

Мои статьи.json Хранение данных с массивом 

[{
  "title": "Casa",
  "picture": "img/portfolio/cabin.png",
  "plot": "Per casa si intende una qualunque struttura utilizzata dagli esseri umani per ripararsi dagli agenti atmosferici. Essa generalmente ospita uno o più nuclei familiari e talvolta anche animali.",
  "like": false
}, 
// ...

У меня есть этот JS для вызова AJAX: 

$.ajax({
  method: "GET",
  url: "articles.json",
}).done(function( msg ) {
  var template = $('#plutos').html();
  var html = Mustache.to_html(template, msg);
  $('#portfolio').html(html);
});

Кто-нибудь может мне помочь?

1 Ответ

0 голосов
/ 23 мая 2018

Ваши данные возвращаются в массив, поэтому измените это 

var html = Mustache.to_html(template, msg);

до 

var html = Mustache.to_html(template, msg[0]); // [0] -> get the first object.

если это работает, то вы можете перебрать массив, чтобы получить каждый объект.

Fwiw, я привык к другой версии, которая использует render: 

var html = Mustache.render(template, msg);
...