How to print key and values in Meteor Template?

Question

I have JSON from helper

{
    "Name": "abc",
    "Age": 24,
    "Address" {
        "street" : "xyz street",
        "city" : "zyz city",
        "country" : "XY"
        }
}

I want to print the address with key and values

<template name="User">
{{#with user}}
 Name : {{Name}}
 Age : {{Age}}
    {{#each Address}}
       {{key}} : {{value}} //Here is my question
    {{/each}}
{{/with}}
</template>

How to print key and values in a template?

Answer 1

The {{#each}} block helper only accepts cursors and arrays arguments.

You could override the Address helper to make it return an array instead of an object.

Template.User.helpers({
  Address: function(){
    return _.map(this.Address, function(value, key){
      return {
        key: key,
        value: value
      };
    });
  }
});

You might want to define this utility function as a template helper :

JS

Template.registerHelper("objectToPairs",function(object){
  return _.map(object, function(value, key) {
    return {
      key: key,
      value: value
    };
  });
});

HTML

<template name="User">
  <ul>
    {{#each objectToPairs Address}}
      <li>{{key}} - {{value}}</li>
    {{/each}}
  </ul>
</template>