12-146 Resolve reloading with new navigation links

src/app/header/header.component.html

@@ -6,15 +6,15 @@
 
         <div class="navbar-default">
             <ul class="nav navbar-nav">
-                <li><a href="#" (click)="onSelect('recipe')">Recipes</a></li>
-                <li><a href="#" (click)="onSelect('shopping-list')">Shopping List</a></li>
+                <li routerLinkActive="active"><a routerLink="/recipes">Recipes</a></li>
+                <li routerLinkActive="active"><a routerLink="/shopping-list">Shopping List</a></li>
             </ul>
             <ul class="nav navbar-nav navbar-right">
                 <li class="dropdown" appDropdown>
-                    <a href="#" class="dropdown-toggle" role="button">Manage <span class="caret"></span></a>
+                    <a style="cursor: pointer;" class="dropdown-toggle" role="button">Manage <span class="caret"></span></a>
                     <ul class="dropdown-menu">
-                        <li><a href="#">Save</a></li>
-                        <li><a href="#">Fetch</a></li>
+                        <li><a style="cursor: pointer;">Save</a></li>
+                        <li><a style="cursor: pointer;">Fetch</a></li>
                     </ul>
                 </li>
             </ul>

src/app/header/header.component.ts

@@ -1,13 +1,8 @@
-import { Component, EventEmitter, Output } from "@angular/core";
+import { Component } from "@angular/core";
 
 @Component({
     selector: 'app-header',
     templateUrl: './header.component.html'
 })
 export class HeaderComponent {
-    @Output() featureSelected = new EventEmitter<string>();
-
-    onSelect(feature: string) {
-        this.featureSelected.emit(feature);
-    }
 }

src/app/recipes/recipe-detail/recipe-detail.component.html

@@ -18,8 +18,8 @@
       </button>
       <ul class="dropdown-menu">
         <li><a (click)="onAddToShoppingList()" style="cursor: pointer;">Add Ingredients</a></li>
-        <li><a href="#">Edit Recipe</a></li>
-        <li><a href="#">Delete Recipe</a></li>
+        <li><a style="cursor: pointer;">Edit Recipe</a></li>
+        <li><a style="cursor: pointer;">Delete Recipe</a></li>
       </ul>
     </div>
   </div>

src/app/recipes/recipe-list/recipe-item/recipe-item.component.html

@@ -1,5 +1,5 @@
 <a 
-    href="#" 
+    style="cursor: pointer;"
     class="list-group-item clearfix"
     (click)="onSelected()">
     <div class="pull-left">