chore(demo): use routerLinkActive instead of custom method (#743)

demo/components/main-menu/main-menu.component.ts

@@ -22,14 +22,11 @@ export class MainMenuComponent {
   public hash:string = '';
 
   public constructor(private router:Router) {
+    this.routes = this.routes.filter((v:any) => v.path !== '**');
     this.router.events.subscribe((event:any) => {
       if (event instanceof NavigationEnd) {
         this.hash = event.url;
       }
     });
   }
-
-  public isActive(link:string):boolean {
-    return this.hash.substring(1) === link;
-  }
 }

demo/components/main-menu/main-menu.template.html

@@ -10,26 +10,9 @@
       </div>
       <div class="section"
            *ngFor="let route of routes | SearchFilter:search.text"
-           [class.active]="isActive(route.path)">
-        <h3 [routerLink]="[route.path]">{{route.data[0]}}</h3>
-
-<!--        <div class="item">
-          <h4>
-            <span [routerLink]="[route.name]">Example</span>
-          </h4>
-        </div>
-
-        <div class="item">
-          <h4>
-            <span [routerLink]="[route.name]">Api</span>
-          </h4>
-        </div>
-
-        <div class="item">
-          <h4>
-            <span [routerLink]="[route.name]">Properties</span>
-          </h4>
-        </div>-->
+           [routerLinkActive]="['active']"
+           [routerLinkActiveOptions]="{exact: true}">
+        <a [routerLink]="[route.path]"><h3>{{route.data[0]}}</h3></a>
       </div>
     </div>
   </div>

demo/config.ts

@@ -84,9 +84,7 @@ export const routes:RouterConfig = [
     component: TypeaheadSectionComponent
   }, {
     path: '**',
-    redirectTo: '',
-    data: ['Getting started'],
-    component: GettingStartedSectionComponent
+    redirectTo: '/'
   }
 ];
 

demo/index.ts

@@ -4,7 +4,7 @@ import {Ng2BootstrapConfig, Ng2BootstrapTheme} from '../ng2-bootstrap';
 import {MainMenuComponent} from './components/main-menu/main-menu.component';
 import {TopMenuComponent} from './components/top-menu/top-menu.component';
 import {bootstrap} from '@angular/platform-browser-dynamic';
-import {APP_BASE_HREF, HashLocationStrategy, LocationStrategy} from '@angular/common';
+import {HashLocationStrategy, LocationStrategy} from '@angular/common';
 import {APP_ROUTER_PROVIDERS} from './config';
 import {ROUTER_DIRECTIVES, Router, NavigationEnd} from '@angular/router';
 
@@ -56,6 +56,5 @@ bootstrap(DemoComponent, [
   APP_ROUTER_PROVIDERS,
   disableDeprecatedForms(),
   provideForms(),
-  {provide: APP_BASE_HREF, useValue: '/'},
   {provide: LocationStrategy, useClass: HashLocationStrategy}
 ]);