You need to pass a model name to the store's modelFor method

Question

I have problem with making hasMany <=> belongTo relationship to work.

I have articles/show view, when I try to list article's comments but I keep recieving the error pointed in the title.

It's something with belongsTo: DS.belongsTo('article') but I couldn't figure out what it is.

Here are my files.

routes/articles/show.js

import Ember from 'ember';
import RSVP from 'rsvp';

export default Ember.Route.extend({
  model(params) {
    return RSVP.hash({
      article: this.store.find("article", params.id),
      comments: this.store.query('comment', { articleId: params.id })
    });
  }
});

controllers/articles/show.js

import Ember from 'ember';

const { computed: { alias, readOnly } } = Ember;

export default Ember.Controller.extend({
  article: alias('model.article'),
  comments: alias('model.comments'),
  length: readOnly('comments.length')
});

templates/articles/show.hbs

<h3>Comments ({{comments.length}})</h3>
{{#each comments as |comment|}}
  <p>Author: {{comment.user.name}}</p>
  <p>Somebody said: {{comment.body}}</p>
{{/each}}

adapters/comment.js

import ApplicationAdapter from './application';
export default ApplicationAdapter.extend({});

serializers/comment.js

import DS from 'ember-data';

export default DS.RESTSerializer.extend({
  attrs: {
    user: { embedded: 'always' },
    article: { embedded: 'always' }
  }
});

serializers/article.js

import DS from 'ember-data';

export default DS.RESTSerializer.extend(DS.EmbeddedRecordsMixin, {
  attrs: {
    comments: { embedded: 'always' }
  }
});

models/article.js

import DS from 'ember-data';
import Ember from 'ember';

const { attr, hasMany } = DS;
const { computed: { gt } } = Ember;

export default DS.Model.extend({
  title:        attr('string'),
  content:      attr('string'),

  authorName:   attr('string'),
  authorAvatar: attr('string'),
  authorUrl:    attr('string'),

  comments:     hasMany('comment', {async: true}),

  hasAvatar: gt('authorAvatar.length', 0)
});

Edit:

I added here the code for comment model as asked in the comments.

models/comment.js

import DS from 'ember-data';

const { belongsTo, attr } = DS;

export default DS.Model.extend({
  article: belongsTo(),
  user: belongsTo(),

  body: attr('string')
});

And here is stacktrace from inspector:

ember.debug.js:16905 Assertion Failed: You need to pass a model name to the store's modelFor method
Error
    at assert (http://ffl.com:8000/assets/vendor.js:16268:13)
    at Object.assert (http://ffl.com:8000/assets/vendor.js:27196:34)
    at assert (http://ffl.com:8000/assets/vendor.js:135212:37)
    at Class.modelFor (http://ffl.com:8000/assets/vendor.js:145201:41)
    at Class._internalModelForId (http://ffl.com:8000/assets/vendor.js:144337:29)
    at Class._pushResourceIdentifier (http://ffl.com:8000/assets/vendor.js:145716:19)
    at BelongsToRelationship.updateData (http://ffl.com:8000/assets/vendor.js:142394:36)
    at BelongsToRelationship.push (http://ffl.com:8000/assets/vendor.js:142976:14)
    at http://ffl.com:8000/assets/vendor.js:145795:20
    at http://ffl.com:8000/assets/vendor.js:141943:18
defaultDispatch @   ember.debug.js:16905
dispatchError   @   ember.debug.js:16888
onerrorDefault  @   ember.debug.js:30389
trigger @   ember.debug.js:57833
(anonymous) @   ember.debug.js:58717
invoke  @   ember.debug.js:339
flush   @   ember.debug.js:407
flush   @   ember.debug.js:531
end @   ember.debug.js:601
run @   ember.debug.js:724
join    @   ember.debug.js:746
run.join    @   ember.debug.js:21556
hash.success    @   rest.js:954
fire    @   jquery.js:3305
fireWith    @   jquery.js:3435
done    @   jquery.js:9242
(anonymous) @   jquery.js:9484

Answer 1

I checked your issue and repo. The problem was just with comment serializer in Ember.js. It should be:

import DS from 'ember-data';

export default DS.RESTSerializer.extend(DS.EmbeddedRecordsMixin, {
  attrs: {
    article: { embedded: 'always' },
    user: { embedded: 'always' }
  }
});

Answer 2

I cloned your project branch refactor-and-upgrade-ember but mirage is not done. So I looked at the code

headTags() {
  let article = this.modelFor(this.routeName);
}

This is in routes articles show ,can you try and remove it and try.