Handlebars Helpers

by ethan_selzer

HTML

<script src="//cdnjs.cloudflare.com/ajax/libs/handlebars.js/1.0.0-rc.3/handlebars.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/ember.js/1.0.0-rc.1/ember.js"></script>
<script type="text/x-handlebars" data-template-name="application">
    <h1>Application Template</h1>
    {{ outlet }}
</script>

<script type="text/x-handlebars" data-template-name="index">
    <h2>Index Template</h2>
    <p>Bound: {{ capitalizeFirstLetter test }}</p>
    <p>Unbound: {{ unbound capitalizeFirstLetter test }}</p>
</script>

CSS

body {
  padding: 2em;   
}

JavaScript

App = Ember.Application.create();

Ember.Handlebars.registerBoundHelper( 'capitalizeFirstLetter', function( value ){
    return value.charAt( 0 ).toUpperCase() + value.slice( 1 );
} );

App.IndexController = Ember.Controller.extend( {
    test : 'ok',
    
    init : function(){
        this._super();
        window.setInterval( $.proxy( function(){
            this.get( 'test' ) === 'ok' ? 
                this.set( 'test', 'buddy' ) : 
                this.set( 'test', 'ok' );
        }, this ), 2000 );
    }
} );