ember数据未加载belongsTo模型

时间:2016-09-15 14:59:28

标签: javascript ember.js ember-data

我使用的是ember 2.8.0和ember-data 2.8.0。我定义了以下模型:

//app/models/store.js
import DS from 'ember-data';

export default DS.Model.extend({
    name: DS.attr('string'),
    floor: DS.belongsTo('floor'),
    number: DS.attr('string'),
    phone: DS.attr('string'),
    email: DS.attr('string'),
    photo: DS.attr(),
    createdAt: DS.attr('date'),
    updatedAt: DS.attr('date')
});

//app/models/floor.js
import DS from 'ember-data';

export default DS.Model.extend({
    name: DS.attr('string'),
    stores: DS.hasMany('store'),
    createdAt: DS.attr('date'),
    updatedAt: DS.attr('date')
});

我的 router.js 有以下路线:

//app/router.js
this.route('stores', function() {
    this.route('new');
    this.route('edit');
});

我的 templates / stores / index.hbs 包含以下{{#each}}声明:

<tbody>
      {{#each model as |store|}}
       <tr>
           <td>{{store.name}}</td>
           <td>{{store.number}}</td>
           <td>{{store.floor.name}}</td>
           <td>{{store.phone}}</td>
           <td>{{store.email}}</td>
           <td>{{moment-format store.createdAt}}</td>
           <td>{{moment-format store.updatedAt}}</td>   
       </tr>
       {{/each}}
</tbody>

我原本预计行{{store.floor.name}}会对表格中的每一行向/ floors / {id}发出请求。

我错过了什么? 在Ember处理这个问题的正确方法是什么?

我的api应该返回与下面不同的内容吗?

[{"id":1,"floorId":1,"name":"McDonalds","number":"10-A","phone":"(11) 2020-3455","email":"lapa@mcdonalds.com.br","photo":null,"createdAt":"2016-09-15T13:45:32.000Z","updatedAt":"2016-09-15T13:45:32.000Z"}]

我是否应该使用其他模型挂钩手动加载相关模型?

2 个答案:

答案 0 :(得分:0)

ember-data预期后端数据的方式取决于你的序列化程序。您没有指定使用哪个序列化程序,因此我无法告诉您它的期望。但是内部的ember-data预期的格式是jsonapi。因此,对于您的情况,这是正确的:

{
  "data": [
    {
      "id": "1",
      "type": "store",
      "attributes": {
        "name": "McDonalds",
        "number": "10-A",
        "phone": "(11) 2020-3455",
        "email": "lapa@mcdonalds.com.br",
        "photo": null,
        "createdAt": "2016-09-15T13:45:32.000Z",
        "updatedAt": "2016-09-15T13:45:32.000Z"
      },
      "relationships": {
        "floor": {
          "data": {
            "type": "floor",
            "id":"1"
          }
        }
      }
    }
  ]
}

确保序列化程序为您的后端响应返回此格式。

答案 1 :(得分:0)

最初(并且顽皮地)在评论中回答,您的store模型的属性名称应该与服务器提供的内容相匹配,除非您有defined custom processing for them in your serializer。因此,请返回floor而不是floorId,事情可能会开始起作用。

我不完全确定为什么它不适合您更改属性名称以匹配服务器结果(floor: DS... => floorId: DS...)。据我所知,它也应该以这种方式工作(就像在我刚才尝试时那样)。我喜欢采用PEBKAC方法,所以在可用信息有限的情况下,我会假设您的测试条件可能存在缺陷。也许您已经修改了服务器以返回floor,这不再符合模型的期望。也许您忘记更改模板中的{{store.floor.name}}以匹配新定义。如果使用Ember-CLI,可能只是忘了重建项目。

或者我可能根本不知道我在谈论什么,如果你足够关心并试图排除用户错误,你应该问一个新问题。