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
不是一个好的模型名称。模型名称应始终是名词,或至少以名词结尾。
前言:这个项目有很多第一次,比如我第一次搭建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
不是一个好的模型名称。模型名称应始终是名词,或至少以名词结尾。