Ember app无法从本地文件加载json数据

我一直在关注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。 任何帮助赞赏! 谢谢!

Ember附带开发服务器(localhost:4200),它不能像Web服务器一样使用,也不能用于响应ajax请求。 你不能使用localhost:4200端点使这个工作Ember.$.getJSON("/products.json")

您需要后端任何Web服务器来返回响应。 如果您目前没有这个用于开发目的,则需要使用动态渲染数据,然后我更喜欢使用ember-cli-mirage插件。

http://www.ember-cli-mirage.com/docs/v0.3.x/

将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工作……

这里也有一个post: https : //discuss.emberjs.com/t/how-to-import-data-from-json-file-to-ember-app

但是……不要指望它适当地存在于余烬数据存储中 – 并且function与许多情况下的预期相同。