вот адаптер В Ember Data адаптер определяет, как данные сохраняются в хранилище данных бэкэнда.Такие вещи, как внутренний сервер, формат 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 Data - это другое понятие, чем метод модели в Маршрутах, хотя они имеют одно и то же имя. Вот модель
/* 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>
run
Uncaught TypeError: Cannot read property 'initializedRelationships' of
undefined
https://i.stack.imgur.com/y7Ax0.png
вот мое приложение ссылка на диск