Question

我在理解EmberJS的模型和关系方面遇到了问题，特别是与async和JSONAAPIAdapter结合使用时。我需要使用JSON api标准。

我使用的版本是Ember 2.2.0和Ember-data v2.3.0-beta.5。我想要完成的是一个相当简单的结构，其中列出了课程列表，一旦点击课程，它应该显示该特定课程的课程列表。没什么太难的，但我仍在苦苦挣扎。

虽然下面的代码确实有效，但在从一个课程导航到另一个课程时似乎没有重新加载模型。访问/ course / 1 /时，它显示正确的课程。但是当通过点击它从/课程导航到课程时，它似乎没有加载。我认为通过将async设置为true，它应该将其作为一个不同的请求处理，但似乎并非如此。

这是我的代码：

/app/application/adapter.js

import DS from 'ember-data';

export default DS.JSONAPIAdapter.extend({
    host: 'http://coursedev.api'
});

路由器

Router.map(function() {
  this.route('courses');
  this.route('course', { path: '/course/:course_id'}, function() {

  });
});

/courses/route.js

import Ember from 'ember';

export default Ember.Route.extend({
    model() {
        return Ember.RSVP.hash({
            courses: this.store.findAll('course')
        });
    }
});

/courses/template.hbs

<h1>Courses list</h1>

<section class="block-list">
    <ul>
    {{#each model.courses as |course|}}
        <li class="with-chevron">{{#link-to 'course' course}}{{course.title}}{{/link-to}}</li>
    {{else}}
        <li>No courses have been found.</li>
    {{/each}}   
    </ul>
</section>

/course/model.js

import DS from 'ember-data';

export default DS.Model.extend({
    title: DS.attr('string'),
    body: DS.attr('string'),
    lessons: DS.hasMany('lesson', { async: true } )
});

/course/route.js

import Ember from 'ember';

export default Ember.Route.extend({
    model(params) {
        return this.store.findRecord('course', params.course_id);
    }
});

/course/template.hbs

<h1>{{model.title}}</h1>

{{model.body}}

<br /><br />

<h2>Lessons in this course</h2>

{{model.lessons}}

<section class="block-list">
    <ul>
    {{#each model.lessons as |lesson|}}
        <li class="with-chevron"><a>{{lesson.title}}</a></li>
    {{else}}
        <li>No lessons have been found for this course.</li>
    {{/each}}   
    </ul>
</section>

/lesson/model.js

import DS from 'ember-data';

export default DS.Model.extend({
    title: DS.attr('string'),
    body: DS.attr('string'),
    course: DS.belongsTo('course', { async: true })
});

api提供的JSON数据可以在这里找到：

API /课程 http://pastebin.com/hxY502gT

API /课程/ 1 http://pastebin.com/LDSsbuzr

我在ember-data repo GitHub上发现了关于模型刷新的问题，但是我不确定这是否是同一个问题。如前所述，async选项是为了收集每门课程的正确课程而做的新请求，对吗？

希望有人可以指出我正确的方向。提前谢谢！

Answer 1

我解决了！显然，课程的链接应该通过course.id完成，而不仅仅是课程。

{{#link-to 'course' course}} > {{#link-to 'course' course.id}}

EmberJS JSONAPIAdapter w / hasMany

1 个答案: