CODEWITHSUNDEEP
ember.js
Combustion007
Combustion007

Reputation: 474

{{#each loop}} not working. What would be the right way to get it going

I am following an example at "emberjs.com" which isn't going too well. I have a "GuestController" and "GuestView" within my application. I would like to use the "{{#view}} & {{#each}} to output an object called "guests" from the "GuestView". I am following this online example:

http://emberjs.com/documentation/#toc_displaying-a-list-of-items

fiddle: http://jsfiddle.net/exciter/MjA5A/8/

Here is the code:

APP CODE:

$(function(){

    App = Ember.Application.create({
        ready: function(){
            //alert("APP INIT");
        }
    });

    App.ApplicationController = Ember.Controller.extend();
    App.ApplicationView = Ember.View.extend({
        templateName: "application",
        classNames: ['']
    });

    App.GuestController = Ember.Controller.extend();
    App.GuestView = Ember.View.extend({

        guests: [{name:"The Doctor" },
                 {name:"The Scientist" },
                 {name:"The Maestro"}]

    });

    App.initialize();
});

HTML:

<script type="text/x-handlebars" data-template-name="application">

    {{#each App.GuestController}}
        {{#view App.GuestView}}
            {{guests}}
        {{/view}}
    {{/each}}
</script>

Upvotes: 1

Views: 173

Answers (1)

Mudassir Ali
Mudassir Ali

Reputation: 8041

First of all, we use {{each}} block helper to iterate over an array of items, now when you say {{#each GuestController}} the controller should be of type Ember.ArrayController, and the {{#each GuestController}} looks for the content property inside the GuestController which will be used to iterate over, As per the example I think this is what you are trying to implement...

Instead if you want to iterate over an Array inside a view check this

Upvotes: 6

Related Questions