Ember.js 余烬数据有多个侧加载返回0长度

我正在尝试使用简单的hasMany-ember数据关联。为侧载准备的数据，ids集合。但是，关联的结果长度为零。而且数据还没有显示出来

JSBin：

来自此JSBin的代码：

App = Ember.Application.create();

App.Router.map(function() {
  this.resource('flags');
});

App.FlagsRoute = Ember.Route.extend({
  model: function() {
    return this.store.find('flag');
  }
});

App.FlagsController = Ember.ArrayController.extend({
});

App.ApplicationController = Ember.Controller.extend({
  init: function() {
    this.transitionToRoute('flags');
  }
});

App.ApplicationAdapter= DS.RESTAdapter;

App.Flag = DS.Model.extend({
  country: DS.attr('string'),
  colors: DS.hasMany('color')
});

App.Color = DS.Model.extend({
  name: DS.attr()
});

$.mockjax({
    url:  '/flags',
    dataType: 'json',
  responseText: {
    flags: [
      {
        id: 1,
        country: 'Germany',
        color_ids: [1, 2, 3]
      },
      {
        id: 2,
        country: 'Russia',
        color_ids: [2, 4, 5]
      },
      {
        id: 3,
        country: 'USA',
        color_ids: [2, 4, 5]
      }
    ],
    colors: [
      {
        id: 1,
        name: "black"
      },
      {
        id: 2,
        name: "red"
      },
      {
        id: 3,
        name: "yellow"
      },
      {
        id: 4,
        name: "white"
      },
      {
        id: 5,
        color: "blue"
      }
     ]
  }
});

  <script type="text/x-handlebars" data-template-name="flags">
    <table class="table table-bordered table-striped">
      <thead>
        <tr>
          <th>Country Name</th>
          <th>Flag colors number</th>
          <th>Flag color names</th>
        </tr>
      </thead>
      <tbody>
        {{#each}}
        <tr>
          <td>{{country}}</td>
          <td>{{colors.length}}</td>
          <td>
            {{#each color in colors}}
              {{color.name}}<br>
            {{/each}}
          </td>
        </tr>
        {{/each}}
      </tbody>
    </table>
  </script>

App=Ember.Application.create（）；
App.Router.map（函数（）{
此.resource（'flags'）；
});
App.FlagsRoute=Ember.Route.extend({
模型：函数（）{
返回此.store.find（'flag'）；
}
});
App.FlagsController=Ember.ArrayController.extend({
});
App.ApplicationController=Ember.Controller.extend({
init:function（）{
这条路线（“标志”）；
}
});
App.ApplicationAdapter=DS.RESTAdapter；
App.Flag=DS.Model.extend({
国家/地区：DS.attr（'string'），
颜色：DS.hasMany（'color'））
});
App.Color=DS.Model.extend({
名称：DS.attr（）
});
$.mockjax({
url:“/flags”，
数据类型：“json”，
答复正文：{
旗帜：[
{
id:1，
国家：'德国'，
颜色标识：[1,2,3]
},
{
id:2，
国家:"俄罗斯",，
颜色标识：[2,4,5]
},
{
id:3，
国家：'美国'，
颜色标识：[2,4,5]
}
],
颜色：[
{
id:1，
姓名：“黑色”
},
{
id:2，
姓名：“红色”
},
{
id:3，
名称：“黄色”
},
{
id:4，
姓名：“白色”
},
{
id:5，
颜色：“蓝色”
}
]
}
});
国名
国旗颜色编号
旗帜颜色名称
{{{#各}
{{国家}
{{colors.length}
{{{#各种颜色中的每种颜色}
{{color.name}}

{{/每个}}
{{/每个}}

检查上的部分。问题是，ember需要的是

颜色

，而不是

颜色ID

---

你能解释一下如何修补它吗？我为一个类似的问题提出了一个问题。

flags: [
  {
    id: 1,
    country: 'Germany',
    colors: [1, 2, 3]
  },
  {
    id: 2,
    country: 'Russia',
    colors: [2, 4, 5]
  },
  {
    id: 3,
    country: 'USA',
    colors: [2, 4, 5]
  }
],