How can I use a custom / dynamic attribute to represent in Ember JS?

Question

My Handlebars file looks something like this:

{{#each book in view.bookcase}} {{view App.BookView classBinding="book.read:read:unread"}} {{/each}} 

I would like to add an attribute to the book-id="1" setting book-id="1" or be that as it may in the current book id, but I have no idea how to do this. If I try this ...

 {{#each book in view.bookcase}} {{view App.BookView book-id="book.id" classBinding="book.read:read:unread"}} {{/each}} 

... then the attribute literally gets the value "book.id". Any ideas?

Answer 1

Hmm, at first I thought that using attributeBindings allowed according to this post and this post , but when I try to do this, I get this error:

 Uncaught Error: assertion failed: Setting 'attributeBindings' via Handlebars is not allowed. Please subclass Ember.View and set it there instead. 

So, I think the best method now is to do it in a class.

Control Panel Template:

 <script type="text/x-handlebars"> {{#each book in view.bookcase}} {{view App.BookView classBinding="book.read:read:unread" contentBinding="book"}} {{/each}} </script> 

Extended class:

 App.BookView = Ember.View.extend({ attributeBindings: ['book-id'], 'book-id': function() { return this.content.id; }.property('content.id') }); 

Example: jsFiddle snippet