Как показать ключ и значение объекта json с помощью шаблона руля?

Я начал изучать handlebar.js. Я изо всех сил пытаюсь отобразить данные json.

Мой json выглядит так:

 var data={
          "record1":
          [
             {
               "first":
                      [
                       {
                         "name":"john",
                         "city":"newyork"  
                       },
                       {
                         "name":"britto",
                         "city":"bangalore"  
                       }
                      ]
             },
            {"second":
                 [
                  {
                    "name":"franklin",
                    "city":"newyork"  
                  },
                  {
                    "name":"leo",
                    "city":"bangalore"  
                  }
                ]
            }
        ]
    };

здесь этот json идет от ответа сервера, поэтому я не знаю никаких ключей и значений. Я должен показать ключ и значение динамически, используя handlebar... Я пытался с каждымKey, но у меня нет решения для этого. Кто-нибудь может мне помочь?

Ответы

Ответ 1

Вы можете отображать ключи/значения списка в шаблоне Handlebars следующим образом:

{{#each object}}
  {{@key}}: {{this}}
{{/each}}

Ответ 2

Сначала спасибо, что это привело к тому, что мне нужно было получить ключ.

Если неясно, что OP "this" ссылается на текущий объект этой итерации.

Итак, в данных вашего случая объект имеет запись массива1 с 2 объектами, которые являются массивами объектов: первый и второй.

Использование каждого:

{{#each record1}}
    {{@key}}: {{this}}
{{/each}}

даст вам: first: (объект, массив) second: (object, array)

Вы будете перебирать объект (данные). В этом случае, если вы хотите копать, вам понадобится счетчик, чтобы добраться куда-нибудь еще. Я бы рекомендовал использовать вспомогательный блок блока handlebars, чтобы добраться туда.

Вот документация: http://handlebarsjs.com/block_helpers.html

Ответ 3

Для объектов:

{{#each myObject}}
    Key: {{@key}} Value = {{this}} //renders object like {key: value}
{{/each}}

Обратите внимание, что будут перечислены только те свойства, которые проходят тест hasOwnProperty.

Для массивов:

{{#each myArray}}
    Index: {{@index}} Value = {{this}}
{{/each}}