add routing, unified cart service

Author: KillerCodeMonkey

app/boot.js

@@ -1,4 +1,7 @@
 import {bootstrap} from 'angular2/platform/browser'
 import {AppComponent} from './components/app.component';
+import {ROUTER_PROVIDERS} from 'angular2/router';
 
-bootstrap(AppComponent);
+import {WarenkorbService} from './services/warenkorb.service';
+
+bootstrap(AppComponent, [ROUTER_PROVIDERS, WarenkorbService]);

app/boot.js.map

@@ -1,19 +1,27 @@
-import {Input, Component} from 'angular2/core';
-import {FORM_DIRECTIVES} from 'angular2/common';
+import {Component} from 'angular2/core';
+import {RouteConfig, ROUTER_DIRECTIVES} from 'angular2/router';
+
+import {BestellungComponent} from './bestellung/bestellung.component';
+import {UeberComponent} from './ueber/ueber.component';
+import {NavigationComponent} from './navigation/navigation.component';
+
+@RouteConfig([{
+    path: '/',
+    component: BestellungComponent,
+    name: 'Bestellung',
+    useAsDefault: true
+}, {
+    path: '/about',
+    component: UeberComponent,
+    name: 'Ueber'
+}])
 
 @Component({
-    selector: 'my-app',
+    selector: 'app',
+    directives: [ROUTER_DIRECTIVES, NavigationComponent],
     template: `
-    <h1>
-        Heyho {{name}}
-    </h1>
-    <input [(ngModel)]="name">
+    <navigation></navigation>
+    <router-outlet></router-outlet>
     `
 })
-export class AppComponent {
-    @Input() name : string;
-
-    constructor() {
-        this.name = 'Alice';
-    }
-}
+export class AppComponent {}

app/boot.ts

@@ -0,0 +1,19 @@
+<form #suchFormular="ngForm">
+    <label for="suche">Pizza-Suche</label>
+    <br>
+    <input type="text" name="suche" [(ngModel)]="suche" placeholder="Pizza-Name">
+</form>
+<table class="table">
+    <tbody>
+        <tr *ngFor="#pizza of pizzen">
+            <td>{{index}}</td>
+            <td>{{pizza.name}}</td>
+            <td>{{pizza.preis | currency}}</td>
+            <td>
+                <a class="btn btn-default btn-sm" (click)="zumWarenkorb(pizza)">
+                    Hinzufügen
+                </a>
+        </tr>
+    </tbody>
+</table>
+<warenkorb></warenkorb>

app/components/app.component.js

@@ -0,0 +1,50 @@
+import {Component, Input, OnInit} from 'angular2/core';
+import {NgForm} from 'angular2/common';
+
+import {WarenkorbService} from '../../services/warenkorb.service';
+import {WarenkorbComponent} from '../warenkorb/warenkorb.component.ts';
+
+interface Pizza {
+    id: number,
+    name: string,
+    preis: number
+}
+
+@Component({
+    selector: 'bestellung',
+    directives: [NgForm, WarenkorbComponent],
+    templateUrl: './app/components/bestellung/bestellung.component.html'
+})
+export class BestellungComponent {
+    @Input() suche: string;
+    public pizzen = PIZZEN;
+    public aktuellerWarenkorb;
+
+    constructor(private _warenkorbService: WarenkorbService) {
+    }
+
+    zumWarenkorb(pizza: Pizza) {
+        this._warenkorbService.addWarenkorb({
+            name: pizza.name,
+            preis: pizza.preis
+        });
+    }
+}
+
+var PIZZEN: Pizza[] = [{
+    id: 1,
+    name: 'Pizza Vegetaria',
+    preis: 10.99
+}, {
+    id: 2,
+    name: 'Pizza Salami',
+    preis: 10.99
+}, {
+    id: 3,
+    name: 'Pizza Thunfisch',
+    preis: 10.99
+}, {
+    id: 4,
+    name: 'Aktueller Flyer',
+    preis: 0
+}];