Ember幻影模型:针对多个hasMany和belongsTo

// app/models/user.js
import Model, { hasMany } from '@ember-data/model';

export default class UserModel extends Model {
  @hasMany('post') posts;
}

// app/models/post.js
import Model, { belongsTo } from '@ember-data/model';

export default class PostModel extends Model {
  @belongsTo('user') user;
}

// app/adapters/application.js
import JSONAPIAdapter from '@ember-data/adapter/json-api';

export default class ApplicationAdapter extends JSONAPIAdapter {
  namespace = 'api';
}

// app/serializers/application.js
import JSONAPISerializer from '@ember-data/serializer/json-api';

export default class ApplicationSerializer extends JSONAPISerializer {}

import Route from '@ember/routing/route';
import { inject as service } from '@ember/service';

export default class UserRoute extends Route {
  @service store;

  model(params) {
    return this.store.findRecord('user', params.user_id).then(user => {
      // 创建一个幻影模型实例
      const newPost = this.store.createRecord('post', {
        title: 'New Post',
        user: user
      });
      return { user, newPost };
    });
  }
}

{{!-- app/templates/user.hbs --}}
<h1>{{model.user.name}}</h1>
<ul>
  {{#each model.user.posts as |post|}}
    <li>{{post.title}}</li>
  {{/each}}
</ul>
<form {{on "submit" this.addPost}}>
  <input type="text" value={{this.newPost.title}} {{on "input" (fn (mut this.newPost.title)))}} />
  <button type="submit">Add Post</button>
</form>