@hmblcodr wrote:
The Problem
I want to have a route with two dynamic segments that represent two related models. When I use
link-to
to generate a link to the route, I get the following error:Error: More context objects were passed than there are dynamic segments for the route: list
What I've tried
nested routes
This works but it's nested, which means that the list template is rendered in the
{{outlet}}
of the parent (user) template. I don't want this.messing around with model hooks and serialize
I got the list route
model()
hook to return a hash containing the user and list, andserialize
to return an object with the correct values for each dynamic segment, but the same error appeared.Pass only one object in link-to
Passing only one object (the list) removed the error but resulted in the URL being wrong:
http://localhost:4200/undefined/list-1
Code
The routes are defined as follows:
Router.map(function() { this.route('user', { path: ':username' }); this.route('list', { path: ':username/:slug' }); });
slug
is the list slug, a field in thelist
model.The user route displays all the lists a user has, where each one links to the list page using the following code in the template:
{{#each model.lists as |list|}} {{#link-to "list" model list class='list-group-item'}} {{/each}}
model
is theuser
returned by the user route'smodel()
hook:model(params) { return this.store.queryRecord('user', { username: params.username }); }
The list route
model()
hook returns the list identified by the slug:import Ember from 'ember'; export default Ember.Route.extend({ model(params) { return this.store.queryRecord('list', { slug: params.slug, }); } });
The user model is shown below:
import DS from 'ember-data'; export default DS.Model.extend({ username: DS.attr(), lists: DS.hasMany('list', { async: true }), });
And finally, the list model:
import DS from 'ember-data'; export default DS.Model.extend({ name: DS.attr(), slug: DS.attr(), user: DS.belongsTo('user'), });
Posts: 1
Participants: 1