Ractive.js with Bootstrap example

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/ractive/0.9.14/ractive.js"></script>
<div id='container'></div>

<script id="templateOne" type="x-template">
    <Iterator data='{{data}}'>
    {{name}}
    {{key}}
    {{age}}
    </Iterator>
</script>

JavaScript

Ractive.components.Iterator = Ractive.extend({
    template: 'Iterator: {{#each data:key}}{{#if 2 > key}}{{>content}}{{/if}}{{/each}}'
});

var ractive = new Ractive({
    el: 'container',
    template: '#templateOne',
    data: { 
        data : [{
        name: "Dave",
        key: "Test",
        age: 25
        },
        {
        name: "Tom",
        key: "Whatever",
        age: 42
        },
        {
        name: "Dan",
        key: "Foo",
        age: 32
        }]
    }
});