实现数据库 - 无法读取未定义的属性'initializedRelationships' - Ember js

Question

这里是适配器 在 Ember 数据中，适配器确定如何将数据持久保存到后端数据存储。后端主机、URL 格式和用于与 REST API 通信的标头等内容都可以在适配器中配置。

/* adapters/application.js */
import FirebaseAdapter from "emberfire/adapters/firebase";
export default FirebaseAdapter.extend({});

控制器是可路由的对象，它从路由接收单个属性..这里是控制器

/* controllers/cars.js */
import Controller from "@ember/controller";
export default Controller.extend({
actions: {
deleteCar(id) {
this.get("store")
.findRecord("car", id, { reload: true })
.then(car => {
car.destroyRecord();
car.save();
//self.transitionToRoute("cars");
});
}
}
});

/* controllers/cars/edit.js */
import Controller from "@ember/controller";
export default Controller.extend({
actions: {
editCar: function(id) {
var self = this;
var make = this.get("model.make");
var model = this.get("model.model");
var year = this.get("model.year");
this.store.findRecord("car", id).then(function(car) {
car.set("make", make);
car.set("model", model);
car.set("year", year);
car.save();
self.transitionToRoute("cars");
});
}
}
});

/* controllers/cars/new.js */
import Controller from "@ember/controller";
export default Controller.extend({
actions: {
addCar: function() {
var self = this;
var rand = Math.floor(Math.random() * 10000 + 1);
var newCar = this.store.createRecord("car", {
id: rand,
make: this.get("carMake"),
model: this.get("carModel"),
year: this.get("carYear")
});
newCar.save();
self.transitionToRoute("cars");
}
}
});

在 Ember Data 中，模型是表示应用程序呈现给用户的基础数据的对象。请注意，Ember 数据模型与路由上的模型方法是一个不同的概念，尽管它们共享相同的名称。这是模型

/* models/cars.js */
import DS from "ember-data";
export default DS.Model.extend({
make: DS.attr("string"),
model: DS.attr("string"),
year: DS.attr("string")
});

在 Ember中，当我们想要创建一个可以使用 URL 访问的新页面时，我们需要使用 Ember CLI 生成一个"路由".. 这是路由

/* routes/cars.js */
import Route from "@ember/routing/route";
export default Route.extend({
model() {
return this.store.findAll("car", {
orderBy: "make"
});
}
});

/* routes/cars/edit.js */
import Route from '@ember/routing/route';
export default Route.extend({});

/* routes/cars/new.js */
import Route from "@ember/routing/route";
export default Route.extend({
model() {
return this.store.findAll("car");
}
});

/* routes/users.js*/
import Route from "@ember/routing/route";
import $ from "jquery";
export default Route.extend({
model: function() {
var url = "https://api.github.com/users";
return $.getJSON(url).then(function(data) {
return data.splice(0, 10);
});
}
});

EmberRouter 类管理应用程序状态和 URL.. 这里是路由器

/* router.js */
import EmberRouter from "@ember/routing/router";
import config from "./config/environment";
const Router = EmberRouter.extend({
location: config.locationType,
rootURL: config.rootURL
});
Router.map(function() {
this.route("cars", function() {
this.route("new");
this.route("edit", { path: "/edit/:car_id" });
});
this.route("users");
});
export default Router;

模板用于跨多个页面创建标准布局。更改模板时，基于该模板的页面会自动更改。模板提供标准化控制。

<!-- templates/users.hbs -->
<h1>Github Users</h1>
<ul>
{{#each model as |user|}}
<li>{{user.login}}</li>
{{/each}}
</ul>

<!-- templates/car.hbs -->
{{#link-to "cars.new"}}Create Car{{/link-to}}
<hr>
{{outlet}}
<h1>Cars</h1>
<ul>
{{#each model as |car|}}
<li>
{{car.year}} {{car.make}} {{car.model}} -
{{#link-to "cars.edit" car.id}}Edit{{/link-to}}
<button {{action "deleteCar" car.id}}>Delete</button>
</li>
{{/each}}
</ul>

<!-- templates/application.hbs -->
{{outlet}}

<!-- templates/cars/new.hbs -->
<form {{action "addCar" on="submit"}}>
<p>Make: {{input type="text" value=carMake}}</p>
<p>Model: {{input type="text" value=carModel}}</p>
<p>Year: {{input type="text" value=carYear}}</p>
<p>{{input type="submit" value="submit"}}</p>
</form>

<!-- templates/cars/edit.hbs -->
<form {{action "editCar" model.id on="submit"}}>
<p>Make: {{input type="text" value=model.make}}</p>
<p>Model: {{input type="text" value=model.model}}</p>
<p>Year: {{input type="text" value=model.year}}</p>
<p>{{input type="submit" value="Submit"}}</p>
</form>

跑

Uncaught TypeError: Cannot read property 'initializedRelationships' of 
undefined
https://i.stack.imgur.com/y7Ax0.png

这是我的应用驱动器链接

Answer 1

当我remove the findAll query inside model hook时错误消失了。这可能是火力基地配置的错误。

您错过了输入以下配置。确保app/config/environment.js内有所有这些变量

var ENV = {
firebase: {
apiKey: "your-api-key",
authDomain: "YOUR-FIREBASE-APP.firebaseapp.com",
databaseURL: "https://YOUR-FIREBASE-APP.firebaseio.com",
projectId: "YOUR-FIREBASE-APP",
storageBucket: "YOUR-FIREBASE-APP.appspot.com",
messagingSenderId: "00000000000"
}
}

我的应用在Firebase上运行良好。请遵循此处的分步方法

您已经安装了emberfire的稳定版本和最新版本，

"emberfire": "^2.0.10",
"emberfire-exp": "^3.0.0-rc.1-4",

这是没有必要的。安装任何一个版本。

Answer 2

如果您使用的是 Ember-CLI 3.12.0，则在创建与应用的 Firebase 连接时，默认情况下，"Emberfire/adapters/Firebase"将自动导入到适配器/应用程序中.js，但事实并非如此。

`/* adapters/application.js */
import FirebaseAdapter from "emberfire/adapters/firebase";
export default FirebaseAdapter.extend({});`

转到那里并将导入编辑为"Emberfire/adapters/Firestore"。

`import FirebaseAdapter from 'emberfire/adapters/firestore';
export default FirebaseAdapter.extend({
});`

并在 package.json 中将您的"Ember-source 降级到：3.10.0">