From 029600408e8204f56b6e46323616265e029580ac Mon Sep 17 00:00:00 2001
From: Nils Dittberner <nils.dittberner@pta.de>
Date: Wed, 22 Nov 2017 13:19:11 +0100
Subject: [PATCH] 12-143 Adding own routing

---
 src/app/app-routing.module.ts | 19 +++++++++++++++++++
 src/app/app.component.html    |  3 +--
 src/app/app.module.ts         |  4 +++-
 3 files changed, 23 insertions(+), 3 deletions(-)
 create mode 100644 src/app/app-routing.module.ts

diff --git a/src/app/app-routing.module.ts b/src/app/app-routing.module.ts
new file mode 100644
index 0000000..8a8cbc1
--- /dev/null
+++ b/src/app/app-routing.module.ts
@@ -0,0 +1,19 @@
+import { NgModule } from '@angular/core';
+import { Routes, RouterModule } from '@angular/router'
+
+import { RecipesComponent } from './recipes/recipes.component';
+import { ShoppingListComponent } from './shopping-list/shopping-list.component';
+
+const appRoutes: Routes = [
+    { path: '', redirectTo: '/recipes', pathMatch: 'full' },
+    { path: 'recipes' , component: RecipesComponent },
+    { path: 'shopping-list', component: ShoppingListComponent }
+];
+
+@NgModule({
+    imports: [RouterModule.forRoot(appRoutes)],
+    exports: [RouterModule]
+})
+export class AppRoutingModule {
+
+}
\ No newline at end of file
diff --git a/src/app/app.component.html b/src/app/app.component.html
index 1c65680..1042b03 100644
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@@ -2,8 +2,7 @@
 <div class="container">
     <div class="row">
         <div class="col-md-12">
-            <app-recipes *ngIf="loadedFeature === 'recipe'"></app-recipes>
-            <app-shopping-list *ngIf="loadedFeature !== 'recipe'"></app-shopping-list>
+            <router-outlet></router-outlet>
         </div>
     </div>
 </div>
\ No newline at end of file
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index a5759cf..59ba483 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -14,6 +14,7 @@ import { ShoppingListComponent } from './shopping-list/shopping-list.component';
 import { ShoppingEditComponent } from './shopping-list/shopping-edit/shopping-edit.component';
 import { DropdownDirective } from './shared/dropdown.directive';
 import { ShoppingListService } from './shopping-list/shopping-list.service';
+import { AppRoutingModule } from './app-routing.module';
 
 
 @NgModule({
@@ -31,7 +32,8 @@ import { ShoppingListService } from './shopping-list/shopping-list.service';
   imports: [
     BrowserModule,
 	  FormsModule,
-    HttpModule
+    HttpModule,
+    AppRoutingModule
   ],
   providers: [ShoppingListService],
   bootstrap: [AppComponent]