Sunday, 8 June 2014

Hello World in Ember.js

Quick Start

>>> Step 1 : Create a html file and include files like ember.js and other dependencies.

    < script src='http://code.jquery.com/jquery-1.10.2.min.js'></script>
    <script src='http://builds.handlebarsjs.com.s3.amazonaws.com/handlebars-1.0.0.js'></script>
    <script src='http://builds.emberjs.com/tags/v1.3.0/ember.js'></script>

>>>Step 2: Create a view using handlebars template
It replaces body of html page
 
    <script type='text/x-handlebars' data-template-name='application'>
         <h1>{{appName}}</h1>
    </script>

>>>Step 3: Initialize ember application
   <script type='text/javascript'>
        App = Ember.Application.create({});
    </script>

>>>Step 4: Controller
Template used named above is 'application'. So, controller name should be 'ApplicationController'.

   <script type='text/javascript'>
        App.ApplicationController = Ember.Application.extend({
             message: 'Hello World'
        });
    </script>