Question

I’m using emebr-1.0.pre.js

Having doubt in each helper context, below the following code for the reference. In the output UI title replaces “book1” and “book2” but the input fields are empty.

My doubt is which context is used in each helper, within {{each}} helper ‘this’ refers what??

window.App = Ember.Application.create({});


App.Book = Ember.Object.extend({
   title : null,
  author : null
 });

BooksController.js

App.BooksController = Ember.ObjectController.extend({
    content : [
                App.Book.create({title : "Book1", author : 'author1'}),
                App.Book.create({title: 'Book2', author : 'author2'})
               ]           
});

BooksListView.js

 App.BooksView = Ember.View.extend({
  templateName : "books_list",
  controllerBinding : "App.BooksController"
})

Handlebars

{{#each content}}
   <label>{{this.title}}</label>
   {{view Ember.TextField valueBinding="this.author"}}
{{/each}}

The JSFiddle is here.

Answer 1

First, the BooksListView has a controllerBinding set to App.BooksController.

It should be to something like App.booksController, because you want to bind it to an instance instead of a class:

App.booksController = App.BooksController.create();

App.BooksListView = Ember.View.extend({
   controllerBinding: "App.booksController"
});

About the {{each}} context, this refer to the current object, so this work as expected. Except that you don’t should use {{this.aproperty}} on the {{each}} helper, just write {{aproperty}}:

{{#each content}}
  <label>{{title}}</label>
  {{view Ember.TextField valueBinding="author"}}
{{/each}}

And here is the JSFiddle which works. I have intentionally added {{this}} in order to let you see on which object it refers.