Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html>
<head>
<script src="//code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/handlebars.js/1.0.0/handlebars.js"></script>
  <meta charset="utf-8">
  <title>JS Bin</title>
</head>
<body>
​
    <div id="output"></div>
​
    <script id="test" type="text/x-handlebars-template">
    {{#each videos}}
      <ul>
        <li>{{slug}}</li>
        <li>{{videoBanner}}</li>
        <li>{{videoId}}</li>
        <li>
          <ul>
          {{#each videoPoster}}
             <li>{{this}}</li>
          {{/each}}
          </ul>
        </li>
      </ul>
    {{/each}}
    </script>
</body>
</html>
 
var data = {'videos' : [{
    slug: "slug-q",
    videoBanner: true,
    videoId: "e_pBdaN5nEY",
    videoPoster: {
        "small": "630x630_partner.jpg",
        "medium": "853x863_partner.jpg",
        "large": "1306x653_partner.jpg",
        "xlarge": "1832x704_partner.jpg"
    }
},
{
    slug: "slug-w",
    videoBanner: true,
    videoId: "e_fewf5nEY",
    videoPoster: {
        "small": "630x630_partnerY.jpg",
        "medium": "853x863_partnerY.jpg",
        "large": "1306x653_partnerY.jpg",
        "xlarge": "1832x704_partnerY.jpg"
    }
}]};
​
var source   = $('#test').html();
var template = Handlebars.compile(source);
$('#output').html(template(data));
​
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
stebrupro
0viewers