|
| 1 | +// #docregion |
| 2 | +declare var angular: angular.IAngularStatic; |
| 3 | +import { NgModule } from '@angular/core'; |
| 4 | +import { BrowserModule } from '@angular/platform-browser'; |
| 5 | +import { UpgradeModule } from '@angular/upgrade/static'; |
| 6 | + |
| 7 | +import { HeroModule } from './hero.module'; |
| 8 | + |
| 9 | +// #docregion router-config |
| 10 | +import { HashLocationStrategy, LocationStrategy } from '@angular/common'; |
| 11 | +import { RouterModule, UrlHandlingStrategy, UrlTree } from '@angular/router'; |
| 12 | +import { AppComponent } from './app.component'; |
| 13 | + |
| 14 | +class HybridUrlHandlingStrategy implements UrlHandlingStrategy { |
| 15 | + // use only process the `/hero` url |
| 16 | + shouldProcessUrl(url: UrlTree) { return url.toString().startsWith('/hero'); } |
| 17 | + extract(url: UrlTree) { return url; } |
| 18 | + merge(url: UrlTree, whole: UrlTree) { return url; } |
| 19 | +} |
| 20 | + |
| 21 | +@NgModule({ |
| 22 | + imports: [ |
| 23 | + BrowserModule, |
| 24 | + UpgradeModule, |
| 25 | + HeroModule, |
| 26 | + RouterModule.forRoot([]) |
| 27 | + ], |
| 28 | + providers: [ |
| 29 | + // use hash location strategy |
| 30 | + { provide: LocationStrategy, useClass: HashLocationStrategy }, |
| 31 | + // use custom url handling strategy |
| 32 | + { provide: UrlHandlingStrategy, useClass: HybridUrlHandlingStrategy } |
| 33 | + ], |
| 34 | + declarations: [ AppComponent ], |
| 35 | + bootstrap: [ AppComponent ] |
| 36 | +}) |
| 37 | +export class AppModule { } |
| 38 | +// #enddocregion router-config |
| 39 | + |
| 40 | +import { Villain } from '../villain'; |
| 41 | + |
| 42 | +export const villainDetail = { |
| 43 | + template: ` |
| 44 | + <h1>Villain detail</h1> |
| 45 | + <h2>{{$ctrl.villain.name}} - {{$ctrl.villain.description}}</h2> |
| 46 | + `, |
| 47 | + controller: function() { |
| 48 | + this.villain = new Villain(1, 'Mr. Nice', 'No More Mr. Nice Guy'); |
| 49 | + } |
| 50 | +}; |
| 51 | + |
| 52 | +angular.module('heroApp', ['ngRoute']) |
| 53 | + .component('villainDetail', villainDetail) |
| 54 | + .config(['$locationProvider', '$routeProvider', |
| 55 | + function config($locationProvider: angular.ILocationProvider, |
| 56 | + $routeProvider: angular.route.IRouteProvider) { |
| 57 | + // #docregion ajs-route |
| 58 | + $routeProvider |
| 59 | + .when('/villain', { template: '<villain-detail></villain-detail>' }); |
| 60 | + // #enddocregion ajs-route |
| 61 | + } |
| 62 | + ]); |
0 commit comments