Ember 1.7.0 template

by amindunited

HTML

<script type="text/x-handlebars" data-template-name="application">
    <h1>Application Top</h1>
    {{outlet}}
</script>

<script type="text/x-handlebars" data-template-name="index">
    <h2>Index!</h2>
    {{#link-to 'page'}}Page{{/link-to}}
</script>


<script type="text/x-handlebars" data-template-name="page">
    <h2>Page</h2>
    {{outlet}}
    {{#link-to 'index'}}Home{{/link-to}}

    {{#each obj in model}}
    <li>
        {{input value=obj.name}}
    </li>
    {{/each}}
</script>

<script type="text/x-handlebars" data-template-name="page/index">
    <h2>Page Index!</h2>
    {{#link-to 'page'}}Page{{/link-to}}
        
    <button {{action 'blam'}}>BLAM!</button>
</script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/1.3.0/handlebars.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/ember.js/1.7.0/ember.min.js"></script>

JavaScript

App = Em.Application.create();

App.Router.map(function(){
    this.resource("page", function(){
        
    });
});

App.Model = Em.Object.extend({
    
    get_data: function(){
        console.log("Verp!");
        return [
            {
                name: "One"
            },
            {
                name: "two"
            },
            {
                name: "thee"
            }
        ]
    }
});

App.Page = App.Model.extend({
    get_data: function(){
        this._super();
        return [
            {
                name: "Sevne"
            },
            {
                name: "Ate"
            },
            {
                name: "Nine"
            }
        ]
    }
})


App.PageRoute = Em.Route.extend({
    model: function(){
        console.log("now we prepair a model");
        var new_model = App.Page.create()
        return new_model.get_data();
    }
});


App.PageController = Em.Controller.extend({
    actions: {
        blam: function(){
            alert("BLAM!");
        }
    }
});

App.PageView = Em.View.extend({
    didInsertElement: function(){
        console.log("your in the page!!!", this);
    }
});