Toran Billups
Toran Billups

Reputation: 27399

How to build nested routes with ember.js that don't require all arguments?

I have a nested route structure that allows for pagination / sorting / searching that will essentially tweak the ArrayController in some way. The problem I have with the current implementation is that everything is required to get a valid page to render.

http://localhost:8000/#/page/1/sort/username/search/dave

If I only pass the page I get the error

Uncaught Error: assertion failed: Could not find state for path

Am I missing something in the nested routes or do I need to mark sort/search as optional some how?

PersonApp.Router = Ember.Router.create({
  root: Ember.Route.extend({
    index: Ember.Route.extend({
      route: '/',
      connectOutlets: function(router) {
        router.get('applicationController').connectOutlet('person', router.get('store').findAll(PersonApp.Person));
      },
      paginated: Ember.Route.extend({
        route: '/page',
        index: Ember.Route.extend({
          route: '/:page_id',
          connectOutlets: function(router, context) {
            console.log("here with page id " + context.page_id);
            router.get('personController').set('selectedPage', context.page_id);
          },
          exit: function(router) {
            router.get('personController').set('selectedPage', undefined);
          },
          sorted: Ember.Route.extend({
            route: '/sort',
            index: Ember.Route.extend({
              route: '/:column',
              connectOutlets: function(router, context) {
                console.log("SORTING " + context.column);
              },
              search: Ember.Route.extend({
                route: '/search',
                index: Ember.Route.extend({
                  route: '/:term',
                  connectOutlets: function(router, context) {
                    console.log("SEARCHING " + context.term);
                  }
                })
              })
            })
          })
        })
      })
    })
  })
});

Upvotes: 1

Views: 1750

Answers (1)

Hardik127
Hardik127

Reputation: 344

Emberjs Router allows routing to only leaf nodes, So You have to make your each node leaf node by adding dummy '/' route in each route. Following question is similar to yours you can look at those. Why does Ember Router only allow navigating to leaf routes?

Upvotes: 3

Related Questions