Ember not showing foreign key field data

Question

I have four models

//models/exam.js

name: attr('string'),
owner: belongsTo('user'),


//models/question.js

content: attr('string'),
exam: belongsTo('exam')


//models/answer.js

owner: belongsTo('user'),
question: belongsTo('question'),
answer: attr('string'),
remarks: attr('string'),
exam: belongsTo('exam')


//models/user.js

owner : attr('string'),
email : attr('string'),
password : attr('string'),

I load the models into a route. Then, when I run the following template code,

{{#each model.answers as |ans|}}
<p>{{ans.question.content}}</p>
{{/each}}

//route.js

import Route from '@ember/routing/route';
import { hash } from 'rsvp';

export default Route.extend({
    model: function(params){
        return hash({
            student: this.store.findRecord('student',params.id),
            answers: this.store.query('answer',{
                owner: params.id
            }),
        });
    }
});

it shows the output as follows

<frontend@model:question::ember276:5>
<frontend@model:question::ember281:6>
<frontend@model:question::ember286:4>

why is it showing such an code, why not showning the original content?

Answer 1

I think you encountered a very special and rare case. The content has a special meaning for ember relationships. That's internal stuff and an end-user should not deal with it. But that's the reason, why you get

<frontend@model:question::ember276:5>

for

{{ans.question.content}} {{!-- .content doesn't return the content attribute --}}

I would work around it by changing the attribute's name at server and ember-model. If I server's attribute-name is not mutable, I would customize the ember-serializer. I.e.:

//app/serializers/person.js (ember g serializer question)
import DS from 'ember-data';

export default DS.JSONAPISerializer.extend({
  attrs: {
    questionContent: 'content' //map server's attribute content to ember-model's questionContent
  }
});