[英]Ember app cannot load json data from local file
I have been following the ember quick start guide to create an app that displays some data ( https://guides.emberjs.com/v2.13.0/getting-started/quick-start/ ) but instead of displaying just a javascript array with scientists names, I want to display the products from the following json. 我一直在按照ember快速入门指南创建一个可显示一些数据的应用程序( https://guides.emberjs.com/v2.13.0/getting-started/quick-start/ ),而不是仅显示带有科学家的名字,我想显示以下json的产品。
I have placed the json file in the public folder. 我已将json文件放在公共文件夹中。
It looks like: 看起来像:
{
"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"
},
and so on. 等等。
My code for the model of the route for displaying the list is as follows 我用于显示列表的路线模型的代码如下
import Ember from 'ember';
export default Ember.Route.extend({
model() {
//return ['Marie Curie', 'Mae Jemison', 'Albert Hofmann'];
return Ember.$.getJSON("/products.json");
}
});
I have followed the tutorial exactly except for the 我完全按照教程学习,除了
return Ember.$.getJSON("/products.json");
line in scientists.js. 科学家行中的代码行。 My data is not being displayed and the error i get in the ember inspector is 未显示我的数据,在余烬检查器中出现的错误是
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
I am very new with ember and fairly new with js. 我对ember很陌生,对js也很陌生。 Any help appreciated! 任何帮助表示赞赏! Thanks! 谢谢!
Ember comes with Development server(localhost:4200) and it can't be used like a webserver and it can't be used to response ajax request. Ember带有开发服务器(localhost:4200),不能像Web服务器一样使用,也不能用于响应Ajax请求。 You can't make this work Ember.$.getJSON("/products.json")
with localhost:4200 endpoint. 您无法通过localhost:4200端点使此工作成为Ember.$.getJSON("/products.json")
。
You need backend any webserver to return response. 您需要后端任何Web服务器以返回响应。 If you don't have that at present then for development purpose, you need to work with dynamic render data, then I prefer to use ember-cli-mirage addon. 如果您目前还没有,那么出于开发目的,您需要使用动态渲染数据,那么我更喜欢使用ember-cli-mirage插件。
http://www.ember-cli-mirage.com/docs/v0.3.x/ http://www.ember-cli-mirage.com/docs/v0.3.x/
What about placing the JSON in the app folder and importing it? 如何将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 - you can use this to try and get a .json working... https://ember-twiddle.com/afb9d71933322860938b3936d617a776-您可以使用它尝试使.json工作...
There is a thread here too: https://discuss.emberjs.com/t/how-to-import-data-from-json-file-to-ember-app 这里也有一个线程: https : //discuss.emberjs.com/t/how-to-import-data-from-json-file-to-ember-app
BUT... don't expect it to properly be in the ember-data store - and function like you'd expect in many situations. 但是...不要期望它正确地位于ember数据存储中-并且在许多情况下都会像您期望的那样起作用。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.