Sign Up for Free

RunKit +

Try any Node.js package right in your browser

This is a playground to test code. It runs a full Node.js environment and already has all of npm’s 400,000 packages pre-installed, including hbs-jsonpath-helper with all npm packages installed. Try it out:

require("handlebars/package.json"); // handlebars is a peer dependency. var hbsJsonpathHelper = require("hbs-jsonpath-helper")

This service is provided by RunKit and is not affiliated with npm, Inc or the package authors.

hbs-jsonpath-helper v0.1.1

A simple handlebars helper that enables you to use jsonpath (to access and traverse nested data) within your templates

hbs-jsonpath-helper

A simple handlebars helper that enables you to use jsonpath (to access and traverse nested data) within your templates

Resources:

Installation & Usage

npm install --save handlebars hbs-jsonpath-helper
const Handlebars = require('handlebars');
const jsonPathHelper = require('hbs-jsonpath-helper');

jsonPathHelper.register();
// Or, you can explicitly pass a Handlebars instance
jsonPathHelper.register(Handlebars);

// Compile template
const template = Handlebars.compile(`
{{jp-get "$.store.book[0].title"}}
`);

// Data passed to the template
const data = { /* ... */ }

// Use compiled template:
const str = template(data); // "Nigel Rees"

API & Examples

For the following data source

const data = {
  store: {
    book: [
      {
        category: 'reference',
        author: 'Nigel Rees',
        title: 'Sayings of the Century',
        price: 8.95,
      },
      {
        category: 'fiction',
        author: 'Evelyn Waugh',
        title: 'Sword of Honour',
        price: 12.99,
      },
      {
        category: 'fiction',
        author: 'Herman Melville',
        title: 'Moby Dick',
        isbn: '0-553-21311-3',
        price: 8.99,
      },
      {
        category: 'fiction',
        author: 'J. R. R. Tolkien',
        title: 'The Lord of the Rings',
        isbn: '0-395-19395-8',
        price: 22.99,
      },
    ],
    bicycle: {
      color: 'red',
      price: 19.95,
    },
  },
};

jp-get

Retrieve a value from current context using jsonpath

Template:

<h1>Books</h1>
<ul>
  {{#each (jp-get "$.store.book[*]")}}
      <li>
        <div class="title">{{title}}</div>
        <div class="author">{{author}}</div>
      </li>
  {{/each}}
</ul>

Result:

<h1>Books</h1>
<ul>
      <li>
        <div class="title">Sayings of the Century</div>
        <div class="author">Nigel Rees</div>
      </li>
      <li>
        <div class="title">Sword of Honour</div>
        <div class="author">Evelyn Waugh</div>
      </li>
      <li>
        <div class="title">Moby Dick</div>
        <div class="author">Herman Melville</div>
      </li>
      <li>
        <div class="title">The Lord of the Rings</div>
        <div class="author">J. R. R. Tolkien</div>
      </li>
</ul>

jp-get-in

Retrieve a value from specified target using jsonpath

Template:

<h1>Books</h1>
<ul>
  {{#each (jp-get-in "book[*]" store)}}
      <li>
        <div class="title">{{title}}</div>
        <div class="author">{{author}}</div>
      </li>
  {{/each}}
</ul>

Result:

<h1>Books</h1>
<ul>
      <li>
        <div class="title">Sayings of the Century</div>
        <div class="author">Nigel Rees</div>
      </li>
      <li>
        <div class="title">Sword of Honour</div>
        <div class="author">Evelyn Waugh</div>
      </li>
      <li>
        <div class="title">Moby Dick</div>
        <div class="author">Herman Melville</div>
      </li>
      <li>
        <div class="title">The Lord of the Rings</div>
        <div class="author">J. R. R. Tolkien</div>
      </li>
</ul>

jp-descend

Use the value derived from current context using jsonpath as the context for embedded block

Template:

<h1>Authors</h1>
<ul>
  {{#jp-descend "$.store.book[*].author"}}
      {{#each .}}
          <li>{{.}}</li>
      {{/each}}
  {{/jp-descend}}
</ul>

Result:

<h1>Authors</h1>
<ul>
          <li>Nigel Rees</li>
          <li>Evelyn Waugh</li>
          <li>Herman Melville</li>
          <li>J. R. R. Tolkien</li>
</ul>

jp-descend-in

Use the value derived from specified target using jsonpath as the context for embedded block

Template:

<h1>Authors</h1>
<ul>
  {{#jp-descend-in "book[*].author" store}}
      {{#each .}}
          <li>{{.}}</li>
      {{/each}}
  {{/jp-descend-in}}
</ul>

Result:

<h1>Authors</h1>
<ul>
          <li>Nigel Rees</li>
          <li>Evelyn Waugh</li>
          <li>Herman Melville</li>
          <li>J. R. R. Tolkien</li>
</ul>

License

MIT

Metadata

RunKit is a free, in-browser JavaScript dev environment for prototyping Node.js code, with every npm package installed. Sign up to share your code.
Sign Up for Free