Search code examples
ember.jsember-cli

Ember nested route show.hbs params not working


I am trying to show a 'show' template for a list of items.

My index.hbs works as follows:

route/index.js

import Ember from 'ember';

export default Ember.Route.extend({
  model: function() {
    return this.store.find('item');
  }
});

template/items/index.hbs

items/index.hbs
<ul>
  {{#each model as |item|}}
      <li>
        {{#link-to 'items.show' item}}
          {{item.name}}
        {{/link-to}}
      </li>
  {{else}}
      <li>No contacts found.</li>
  {{/each}}
</ul>

However, when I click a link that is generated, it brings me to the correct route (localhost:4200/items/1), however, it gives me the following error: Error while processing route: items.show Assertion Failed: You may not pass 'undefined' as id to the store's find method Error: Assertion Failed: You may not pass 'undefined' as id to the store's find method

Here is my show.js and hbs:

routes/show.js

import Ember from 'ember';
export default Ember.Route.extend({
  model: function(params) {
    return this.store.findAll('item', params.id);
  }
});

and templates/items/show.hbs

{{name}}

here is router.js

import Ember from 'ember';
import config from './config/environment';

var Router = Ember.Router.extend({
  location: config.locationType
});

export default Router.map(function() {
  this.resource('items', function() {
    this.route('show', {path: ':item_id'});
  });
});

I can not figure out when its not working! I read that params is not sent from index to show..but then?!

Thank you in advance. Any exaggerated answer would be most appreciated.


Solution

  • Hope this helps. http://ember-twiddle.com/147af82f6fa69bf97414

    After looking at your code snippets closely, I realized that inside your item:model hook you are passing params.id to store.findAll return this.store.findAll('item', params.id), however in your router.js you specified it as item_id. You should be using the same param name used in your route definition.