Ember Router transitionTo nested route with params

Question

App.Router.map(function() {
    this.resource('documents', { path: '/documents' }, function() {
        this.route('edit', { path: ':document_id/edit' });
    });
    this.resource('documentsFiltered', { path: '/documents/:type_id' }, function() {
        this.route('edit', { path: ':document_id/edit' });
        this.route('new');
    });
});

And this controller with a subview event that basically transitions to a filtered document

App.DocumentsController = Ember.ArrayController.extend({
    subview: function(context) {
    Ember.run.next(this, function() {
        //window.location.hash = '#/documents/'+context.id;
        return this.transitionTo('documentsFiltered', context);
    });
},
});

My problem is that this code works fine when Hash of page is changed.

But when I run the above code NOT w/ the location.hash bit and w/ the Ember native transitionTo I get a cryptic

Uncaught TypeError: Object [object Object] has no method 'slice'

Any clues?

Thanks

UPDATE:

App.DocumentsFilteredRoute = Ember.Route.extend({
model: function(params) {
    return App.Document.find({type_id: params.type_id});
},
});

{{#collection contentBinding="documents" tagName="ul" class="content-nav"}}
<li {{action subview this}}>{{this.nameOfType}}</li>
{{/collection}}

One cannot tell the exact solution without seeing your call to subview(). But Ember seems to expect an array in this case. You will need to show your call to subview() and the code of your DocumentsFilteredRoute to find the problem. — mavilein, Apr 08 '13 at 21:38

score 5 · Accepted Answer · answered Apr 09 '13 at 08:44

The problem is that your model hook is returning an array, while in your transitionTo you are using a single object. As a rule of thumb your calls to transitionTo should pass the same data structure that is returned by your model hook. Following this rule of thumb i would recommend to do the following:

App.DocumentsController = Ember.ArrayController.extend({
    subview: function(document) {
        var documents = App.Document.find({type_id: document.get("typeId")});
        Ember.run.next(this, function() {
            return this.transitionTo('documentsFiltered', documents);
        });
    }
});

Note: I assume that the type_id is stored in the attribute typeId. Maybe you need to adapt it according to your needs.

Ember Router transitionTo nested route with params

1 Answers1