Ember 检索数据后未设置 hasMany 关系属性

Ember not setting hasMany relationship attribute after retrieving data

前言:这个项目有很多第一次,比如我第一次搭建API,第一次使用JSON API,第一次使用Ember , 第一次在 SO 等上发帖

我正在尝试访问包含最新更新的模板中的 'authors' hasMany 属性。然而,我在模板中访问它时,没有返回任何内容。模型已正确保存,但关系并未设置,因为 latest.contentAuthors 上的 DS.PromiseManyArray 的长度是 0 而承诺已实现({ _length: 0, isFulfilled: true, isRejected: false } ).

我正在使用 Ember 3.10(带 CLI)。我可以完全控制我的后端(LAMP 运行 ExpressionEngine 5)并通过自定义构建的插件为 API 请求提供服务,尽管我不确定这看起来是否重要据我所知,这在很大程度上是一个前端问题。

路线

import Route from '@ember/routing/route';

export default Route.extend({
    model(){
        let latest = this.store.peekAll('latest');
        if (latest.length < 2){
            latest = this.store.query('latest', { limit: 2, include: "people" });
        }
        return latest;
    }
});

基础模型

import DS from 'ember-data';
const { Model } = DS;

export default Model.extend({
    title: DS.attr()
});

最新型号
编辑: 删除了不在原始代码中的冗余 属性

import DS from 'ember-data';
import ExpressionEngineBase from './expression-engine-base';

export default ExpressionEngineBase.extend({
    blurb: DS.attr(),
    contentAuthors: DS.hasMany('person')
});

人物模型
编辑: 删除了不在原始代码中的冗余 属性

import DS from 'ember-data';
import ExpressionEngineBase from './expression-engine-base';

export default ExpressionEngineBase.extend({
    latest: DS.hasMany('latest')
});

模板

{{#each this.model as |latest|}}
    <h2>{{latest.title}}</h2>
    {{#each latest.contentAuthors as |author|}}
        <div>{{author.title}}</div>
    {{else}}
        <div>Can't find author(s)</div>
    {{/each}}
    <p>{{latest.blurb}}</p>
{{/each}}

从服务器发送的数据
编辑:JSON API validator 进行了核对,发现原件不符合要求。我已经更新了后端,但这并没有解决问题。这现在符合该验证器的要求。

{
    "data": [{
        "id": "3161",
        "type": "latest",
        "attributes": {
            "title": "Amazing Video 1"
        },
        "links": {
            "self": "https:\/\/cms.example.com\/api\/v1\/video\/3161"
        },
        "relationships": {
            "people": {
                "data": [{
                    "id": "1",
                    "type": "people"
                }]
            }
        }
    }, {
        "id": "2573",
        "type": "latest",
        "attributes": {
            "title": "Amazing Article 1"
        },
        "links": {
            "self": "https:\/\/cms.example.com\/api\/v1\/white_papers_insights\/2573"
        },
        "relationships": {
            "people": {
                "data": [{
                    "id": "1",
                    "type": "people"
                }, {
                    "id": "52",
                    "type": "people"
                }]
            }
        }
    }],
    "links": {
        "self": "https:\/\/cms.example.com\/api\/v1\/latest?include=people&limit=2"
    },
    "included": [{
        "id": "1",
        "type": "people",
        "links": {
            "self": "https:\/\/cms.example.com\/api\/v1\/people\/1",
            "channel": "https:\/\/cms.example.com\/api\/v1\/people"
        },
        "attributes": {
            "title": "Great Author"
        }
    }, {
        "id": "52",
        "type": "people",
        "links": {
            "self": "https:\/\/cms.example.com\/api\/v1\/people\/52",
            "channel": "https:\/\/cms.example.com\/api\/v1\/people"
        },
        "attributes": {
            "title": "Great Co-Author"
        }
    }]
}

重申一下,关系模型正在保存并且可以在 Ember Inspector 中查看,但实际的 link/relationship 没有被设置。

更新: 我试过重命名类型和查询参数无济于事,检查变形是否与被丢弃的关系。

模型中的关系命名为 contentAuthors,但在有效负载中将其命名为 people

所以不是这个:

"people": {
  "data": [{
    "id": "1",
    "type": "people"
  }]
}

这样做:

"contentAuthors": {
  "data": [{
    "id": "1",
    "type": "people"
  }]
}

如果您的模型中有 contentAuthors: DS.hasMany('person')


旁注:latest不是一个好的模型名称。模型名称应始终是名词,或至少以名词结尾。