Search code examples
ember.jstodomvc

Extending TodoMVC to support multiple todo lists


I'm trying to get a feel for Ember by extending the standard Todo MVC. I want to introduce the concept of multiple todo lists (eg shopping list, reading list etc)

My code is online: http://jsbin.com/qidag/1/edit (I get slightly different/more verbose errors when not running inside jsbin)

In the browser, I create a couple of lists. Then when I try and visit a list I get an Ember error:

Error while loading route: Error: Assertion Failed: ArrayProxy expects an Array or Ember.ArrayProxy, but you passed object

If I try and click the route again, the todos load like they are supposed to. Then if I try and click any other link to load a different list, I get an error:

Error while loading route: TypeError: undefined is not a function

When I refresh on the route, the list loads without errors.

Can anyone enlighten me: why do I get different errors depending on how I visit the route? Have I missed some magic that ember does behind the scenes?

Secondly, my code doesn't work! The errors start appearing when I define my TodosController explicitly as an ArrayController rather that the controller ember generates. It feels like I'm missing a relationship - I've tried explicitly setting the itemController property and changing Route.map() (routes VS resources etc) but I can't get passed the "object being passed to ArrayProxy" error!

If someone could propose a solution or point me to the relevant docs, I'd be super grateful! Thanks Scazz


Solution

  • You need Route ListsListRoute and template lists/list

    I made example.