github/JavaScriptServices
1
1
Fork 0
mirror of https://github.com/aspnet/JavaScriptServices.git synced 2025-12-25 19:17:30 +00:00
Code Issues Packages Projects Releases Wiki Activity

Upgrade Angular template to Angular 2 RC3 and migrate to new @angular/router

Browse Source
This commit is contained in:
SteveSandersonMS
2016-06-28 12:40:14 +01:00
parent f1325d0cf2
commit 8f2117cf89
9 changed files with 51 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
templates/Angular2Spa/ClientApp/components/app/app.ts
View File

@@ -1,20 +1,11 @@
import * as ng from '@angular/core';
import * as router from '@angular/router-deprecated';
import { Http, HTTP_BINDINGS } from '@angular/http';
import { ROUTER_DIRECTIVES } from '@angular/router';
import { NavMenu } from '../nav-menu/nav-menu';
import { Home } from '../home/home';
import { FetchData } from '../fetch-data/fetch-data';
import { Counter } from '../counter/counter';
@ng.Component({
selector: 'app',
template: require('./app.html'),
directives: [NavMenu, router.ROUTER_DIRECTIVES]
directives: [...ROUTER_DIRECTIVES, NavMenu]
})
@router.RouteConfig([
{ path: '/', component: Home, name: 'Home' },
{ path: '/counter', component: Counter, name: 'Counter' },
{ path: '/fetch-data', component: FetchData, name: 'FetchData' }
])
export class App {
}

14
templates/Angular2Spa/ClientApp/components/nav-menu/nav-menu.html
View File

@@ -7,23 +7,23 @@
<span class='icon-bar'></span>
<span class='icon-bar'></span>
</button>
<a class='navbar-brand' [routerLink]="['/Home']">WebApplicationBasic</a>
<a class='navbar-brand' [routerLink]="['/home']">WebApplicationBasic</a>
</div>
<div class='clearfix'></div>
<div class='navbar-collapse collapse'>
<ul class='nav navbar-nav'>
<li>
<a [routerLink]="['/Home']">
<li [routerLinkActive]="['link-active']">
<a [routerLink]="['/home']">
<span class='glyphicon glyphicon-home'></span> Home
</a>
</li>
<li>
<a [routerLink]="['/Counter']">
<li [routerLinkActive]="['link-active']">
<a [routerLink]="['/counter']">
<span class='glyphicon glyphicon-education'></span> Counter
</a>
</li>
<li>
<a [routerLink]="['/FetchData']">
<li [routerLinkActive]="['link-active']">
<a [routerLink]="['/fetch-data']">
<span class='glyphicon glyphicon-th-list'></span> Fetch data
</a>
</li>

4
templates/Angular2Spa/ClientApp/components/nav-menu/nav-menu.ts
View File

@@ -1,10 +1,10 @@
import * as ng from '@angular/core';
import * as router from '@angular/router-deprecated';
import { ROUTER_DIRECTIVES } from '@angular/router';
@ng.Component({
selector: 'nav-menu',
template: require('./nav-menu.html'),
directives: [router.ROUTER_DIRECTIVES]
directives: [...ROUTER_DIRECTIVES]
})
export class NavMenu {
}