Пыль - цикл по данным JSON

Question

Пыль - цикл по данным JSON

0

Im чрезвычайно застрял здесь. Я использую пыль в качестве компилятора шаблона, но по какой-то причине Im только возвращает одно значение из моего json, не зацикливая и не возвращающее все. Итак, все, что я получаю, это "DWade" любые идеи о том, что происходит? Пыльный новичок, поэтому примеры кода действительно очень полезны.

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>

Delmon Young 23 май 2014, в 01:38

Источник

Теги:

jquery

json

dust.js

2 ответа

0

Как и ваши комментарии с andyw выше, вы получили 1 результат, потому что в javascript-коде вы использовали это: $ ('. Dust-info'). Html (out); с.html(out): js найдет тег с классом "dust-info", затем зациклится на data.locations и по-прежнему заменит html этого тега, а не добавит или отобразится как список, так что вы просто видите 1 результат, andyw answer - лучший способ для циклирования данных и отображения списка данных в шаблоне пыли.

kate 13 июнь 2014, в 00:58

Ещё вопросы

andyw_ · Accepted Answer · 2014-05-22T20-48-00.000Z

Я никогда раньше не использовал пыль, но надеюсь, что смогу немного помочь.

Во-первых, вы очищаете все внутри.dust-info, изменяя innerHTML.dust-info каждый раз, когда вы проходите через $.each

попробуйте это как шаблон

{#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);
})

Этот пример просто добавляет вывод в тело

спасибо, то, что вы послали, похоже, работает, но что не так с моим кодом? Когда я пытаюсь добавить это к моему, я все еще получаю только один результат.
проверьте мой отредактированный ответ
Потрясающие! Спасибо вам большое!