我一直在关注ember快速入门指南来创建一个显示一些数据(https://guides.emberjs.com/v2.13.0/getting-started/quick-start/)的应用程序,但我不想只显示带有科学家名字的javascript数组,而是想显示以下json中的产品。
我已将json文件放在公用文件夹中。
看起来像:
{
"products": [
{
"_id": "58ff60ffcd082f040072305a",
"slug": "apple-tree-printed-linen-butterfly-bow-tie",
"name": "Apple Tree Printed Linen Butterfly Bow Tie ",
"description": "This fun 40 Colori Apple Tree Printed Linen Butterfly Bow Tie features a design of various apple trees built from tiny polka dots. The back of this bow tie features a polka dot print in complementing colours which when the bow tie is tied will pop out from behind making for a subtle yet unique detail. The playful design, stand out natural linen texture, and colourful combinations make this bow tie a perfect accessory for any outfit!\n",
"standard_manufacturer": "58cbafc55491430300c422ff",
"details": "Size: Untied (self-tie) bow tie with an easily adjustable neck strap from 13-3/4'' to 19'' (35 to 48 cm)\nHeight: 6 cm\nMaterial: Printed 100% linen\nCare: Dry clean\nMade in Italy",
"sizes": [
{
"value": "Violet",
"size": "57722c80c8595b0300a11e61",
"_id": "58ff60ffcd082f0400723070",
"marked_as_oos_at": null,
"quantity": -1,
"stock": true,
"id": "58ff60ffcd082f0400723070"
},
等等。
我显示列表路径模型的代码如下
import Ember from 'ember';
export default Ember.Route.extend({
model() {
//return ['Marie Curie', 'Mae Jemison', 'Albert Hofmann'];
return Ember.$.getJSON("/products.json");
}
});
除了
之外,我完全按照教程进行操作return Ember.$.getJSON("/products.json");
排在科学家.js。我的数据没有显示,我在ember检查器中得到的错误是
compiled.js:2 Uncaught TypeError: Failed to execute 'getComputedStyle' on 'Window': parameter 1 is not of type 'Element'.
at E (compiled.js:2)
at Object.u (compiled.js:25)
at compiled.js:25
E @ compiled.js:2
u @ compiled.js:25
(anonymous) @ compiled.js:25
我是非常新的ember和相当新的js。任何帮助赞赏!谢谢!
答案 0 :(得分:1)
Ember附带开发服务器(localhost:4200),它不能像网络服务器一样使用,也不能用于响应ajax请求。您无法使用localhost:4200端点Ember.$.getJSON("/products.json")
进行此工作。
您需要后端任何网络服务器才能返回响应。如果您目前没有这个用于开发目的,则需要使用动态渲染数据, 那我更喜欢使用ember-cli-mirage插件。
答案 1 :(得分:1)
如何将JSON放在app文件夹中并导入它?
import Ember from 'ember';
import yourData from 'your-app/json-file-name.js';
export default Ember.Route.extend({
model() {
return yourData;
}
});
https://ember-twiddle.com/afb9d71933322860938b3936d617a776 - 你可以用它来尝试让.json工作......
这里也有一个主题: https://discuss.emberjs.com/t/how-to-import-data-from-json-file-to-ember-app
但是......不要期望它适当地存在于余烬数据存储中 - 并且在很多情况下都会像你一样期待。