diff --git a/app/app.module.ts b/app/app.module.ts
index ed51bb0..627ef1c 100644
--- a/app/app.module.ts
+++ b/app/app.module.ts
@@ -1,6 +1,10 @@
import { NgModule } from "@angular/core";
import { BrowserModule } from "@angular/platform-browser";
import { FormsModule } from "@angular/forms";
+import { HttpModule } from "@angular/http";
+
+import { InMemoryWebApiModule } from "angular2-in-memory-web-api";
+import { InMemoryDataService } from "./in-memory-data.service";
import { routing } from "./app.routing";
@@ -15,6 +19,8 @@ import { DuckService } from "./duck.service";
imports: [
BrowserModule,
FormsModule,
+ HttpModule,
+ InMemoryWebApiModule.forRoot(InMemoryDataService),
routing
],
declarations: [
diff --git a/app/duck-detail.component.html b/app/duck-detail.component.html
index 201ab8e..71b5d1e 100644
--- a/app/duck-detail.component.html
+++ b/app/duck-detail.component.html
@@ -7,5 +7,6 @@
+
diff --git a/app/duck-detail.component.ts b/app/duck-detail.component.ts
index 9fb700c..b893a3b 100644
--- a/app/duck-detail.component.ts
+++ b/app/duck-detail.component.ts
@@ -26,6 +26,11 @@ export class DuckDetailComponent implements OnInit {
window.history.back();
}
+ save(): void {
+ this.duckService.update(this.duck)
+ .then(this.goBack);
+ }
+
@Input()
duck: Duck;
}
diff --git a/app/duck.service.ts b/app/duck.service.ts
index b2ce01c..68c4fe8 100644
--- a/app/duck.service.ts
+++ b/app/duck.service.ts
@@ -1,12 +1,37 @@
import { Injectable } from "@angular/core";
+import { Headers, Http } from "@angular/http";
+
+import "rxjs/add/operator/toPromise";
import { Duck } from "./models";
-import { DUCKS } from "./mocked-data";
@Injectable()
export class DuckService {
+ private ducksUrl = 'app/ducks';
+ private headers = new Headers({"Content-Type": "application/json"});
+
+ constructor(private http: Http) {}
+
+ private handleError(error: any): Promise {
+ console.error("An error occured", error);
+
+ return Promise.reject(error.message || error);
+ }
+
+ update(duck: Duck): Promise {
+ const url = `${this.ducksUrl}/${duck.id}`;
+
+ return this.http.put(url, JSON.stringify(duck), {headers: this.headers})
+ .toPromise()
+ .then(() => duck)
+ .catch(this.handleError);
+ }
+
getDucks(): Promise {
- return Promise.resolve(DUCKS);
+ return this.http.get(this.ducksUrl)
+ .toPromise()
+ .then(response => response.json().data as Duck[])
+ .catch(this.handleError);
}
getDuck(id: number): Promise {
diff --git a/app/in-memory-data.service.ts b/app/in-memory-data.service.ts
new file mode 100644
index 0000000..cfd7a14
--- /dev/null
+++ b/app/in-memory-data.service.ts
@@ -0,0 +1,13 @@
+import { InMemoryDbService } from "angular2-in-memory-web-api";
+
+export class InMemoryDataService implements InMemoryDbService {
+ createDb() {
+ let ducks = [
+ { id: 1, color: 'yellow' },
+ { id: 2, color: 'blue' },
+ { id: 3, color: 'pink' }
+ ];
+
+ return {ducks};
+ }
+}
diff --git a/app/mocked-data.ts b/app/mocked-data.ts
deleted file mode 100644
index 9779587..0000000
--- a/app/mocked-data.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-import { Duck } from "./models";
-
-export const DUCKS: Duck[] = [
- { id: 1, color: 'yellow' },
- { id: 2, color: 'blue' },
- { id: 3, color: 'pink' }
-];