chore(router): Added ModuleWithProviders to routing exports

closes #2113
This commit is contained in:
Brandon Roberts
2016-08-14 13:54:33 -05:00
committed by Ward Bell
parent 7972eccb8d
commit a35fcb4dfd
33 changed files with 89 additions and 56 deletions
@@ -2,17 +2,16 @@
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule } from '@angular/forms';
import { RouterModule } from '@angular/router';
import { AppComponent } from './app.component';
import { MovieListComponent } from './movie-list.component';
import { routes } from './app.routes';
import { routing } from './app.routing';
@NgModule({
imports: [
BrowserModule,
FormsModule,
RouterModule.forRoot(routes, {})
routing
],
declarations: [
AppComponent,
@@ -1,9 +0,0 @@
// #docregion
import { RouterConfig } from '@angular/router';
import { MovieListComponent } from './movie-list.component';
export const routes: RouterConfig = [
{ path: '', redirectTo: '/movies', pathMatch: 'full' },
{ path: 'movies', component: MovieListComponent }
];
@@ -0,0 +1,12 @@
// #docregion
import { ModuleWithProviders } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { MovieListComponent } from './movie-list.component';
const routes: Routes = [
{ path: '', redirectTo: '/movies', pathMatch: 'full' },
{ path: 'movies', component: MovieListComponent }
];
export const routing: ModuleWithProviders = RouterModule.forRoot(routes);
@@ -2,7 +2,8 @@
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule } from '@angular/forms';
import { XHRBackend } from '@angular/http';
// import { appRouterProviders } from './app.routes';
/* import { routing,
appRoutingProviders } from './app.routing';*/
import { LocationStrategy,
HashLocationStrategy } from '@angular/common';
import { NgModule } from '@angular/core';
@@ -51,7 +52,11 @@ const C_DIRECTIVES = [
// #docregion bootstrap
@NgModule({
imports: [ BrowserModule, FormsModule ],
imports: [
BrowserModule,
FormsModule,
// routing TODO: add routes
],
declarations: [ ...DIRECTIVES,
...B_DIRECTIVES,
...C_DIRECTIVES,
@@ -59,7 +64,7 @@ const C_DIRECTIVES = [
AlexComponent ],
bootstrap: [ AppComponent ],
providers: [
// appRouterProviders, TODO: add routes
// appRoutingProviders, TODO: add routes
{ provide: LocationStrategy, useClass: HashLocationStrategy },
{ provide: XHRBackend, useClass: InMemoryBackendService }, // in-mem server
@@ -71,4 +76,3 @@ export class AppModule {
}
}
// #enddocregion bootstraps
@@ -1,7 +0,0 @@
import { provideRouter, RouterConfig } from '@angular/router';
const routes: RouterConfig = [];
export const appRouterProviders = [
provideRouter(routes)
];
@@ -0,0 +1,10 @@
import { ModuleWithProviders } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
const routes: Routes = [];
export const routing: ModuleWithProviders = RouterModule.forRoot(routes);
export const appRoutingProviders: any[] = [
];
@@ -1,3 +1,4 @@
import { ModuleWithProviders } from '@angular/core';
import { Routes,
RouterModule } from '@angular/router';
@@ -7,4 +8,4 @@ export const routes: Routes = [
{ path: 'heroes', loadChildren: 'app/hero/hero.module.3' }
];
export const routing = RouterModule.forRoot(routes);
export const routing: ModuleWithProviders = RouterModule.forRoot(routes);
@@ -1,4 +1,5 @@
// #docregion
import { ModuleWithProviders } from '@angular/core';
import { Routes,
RouterModule } from '@angular/router';
@@ -11,5 +12,5 @@ export const routes: Routes = [
];
// #docregion forRoot
export const routing = RouterModule.forRoot(routes);
export const routing: ModuleWithProviders = RouterModule.forRoot(routes);
// #enddocregion forRoot
@@ -1,7 +1,8 @@
import { ModuleWithProviders } from '@angular/core';
import { RouterModule } from '@angular/router';
import { ContactComponent } from './contact.component.3';
export const routing = RouterModule.forChild([
export const routing: ModuleWithProviders = RouterModule.forChild([
{ path: 'contact', component: ContactComponent}
]);
@@ -1,9 +1,10 @@
import { ModuleWithProviders } from '@angular/core';
import { RouterModule } from '@angular/router';
import { ContactComponent } from './contact.component';
// #docregion routing
export const routing = RouterModule.forChild([
export const routing: ModuleWithProviders = RouterModule.forChild([
{ path: 'contact', component: ContactComponent}
]);
// #enddocregion
@@ -1,3 +1,4 @@
import { ModuleWithProviders } from '@angular/core';
import { Routes,
RouterModule } from '@angular/router';
@@ -10,4 +11,4 @@ const routes: Routes = [
{ path: ':id', component: CrisisDetailComponent }
];
export const routing = RouterModule.forChild(routes);
export const routing: ModuleWithProviders = RouterModule.forChild(routes);
@@ -1,3 +1,4 @@
import { ModuleWithProviders } from '@angular/core';
import { Routes,
RouterModule } from '@angular/router';
@@ -15,4 +16,4 @@ const routes: Routes = [
}
];
export const routing = RouterModule.forChild(routes);
export const routing: ModuleWithProviders = RouterModule.forChild(routes);
@@ -1,3 +1,4 @@
import { ModuleWithProviders } from '@angular/core';
import { Routes,
RouterModule } from '@angular/router';
@@ -15,4 +16,4 @@ const routes: Routes = [
}
];
export const routing = RouterModule.forChild(routes);
export const routing: ModuleWithProviders = RouterModule.forChild(routes);
@@ -1,5 +1,6 @@
// #docplaster
// #docregion
import { ModuleWithProviders } from '@angular/core';
// #docregion route-config
import { Routes, RouterModule } from '@angular/router';
@@ -36,6 +37,6 @@ export const appRoutingProviders: any[] = [
];
export const routing = RouterModule.forRoot(appRoutes);
export const routing: ModuleWithProviders = RouterModule.forRoot(appRoutes);
// #enddocregion route-config
// #enddocregion
@@ -1,5 +1,6 @@
// #docplaster
// #docregion
import { ModuleWithProviders } from '@angular/core';
// #docregion route-config
import { Routes, RouterModule } from '@angular/router';
@@ -17,5 +18,5 @@ export const appRoutingProviders: any[] = [
];
export const routing = RouterModule.forRoot(appRoutes);
export const routing: ModuleWithProviders = RouterModule.forRoot(appRoutes);
// #enddocregion route-config
@@ -1,5 +1,6 @@
// #docplaster
// #docregion
import { ModuleWithProviders } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { CrisisListComponent } from './crisis-center/crisis-list.component';
@@ -12,4 +13,4 @@ export const appRoutingProviders: any[] = [
];
export const routing = RouterModule.forRoot(appRoutes);
export const routing: ModuleWithProviders = RouterModule.forRoot(appRoutes);
@@ -1,4 +1,5 @@
// #docregion
import { ModuleWithProviders } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
const appRoutes: Routes = [
@@ -9,4 +10,4 @@ export const appRoutingProviders: any[] = [
];
export const routing = RouterModule.forRoot(appRoutes);
export const routing: ModuleWithProviders = RouterModule.forRoot(appRoutes);
@@ -1,4 +1,5 @@
// #docregion
import { ModuleWithProviders } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { loginRoutes,
@@ -12,4 +13,4 @@ export const appRoutingProviders: any[] = [
authProviders
];
export const routing = RouterModule.forRoot(appRoutes);
export const routing: ModuleWithProviders = RouterModule.forRoot(appRoutes);
@@ -1,4 +1,5 @@
// #docregion
import { ModuleWithProviders } from '@angular/core';
// #docregion import-router
import { Routes, RouterModule } from '@angular/router';
// #enddocregion import-router
@@ -32,7 +33,7 @@ export const appRoutingProviders: any[] = [
CanDeactivateGuard
];
export const routing = RouterModule.forRoot(appRoutes);
export const routing: ModuleWithProviders = RouterModule.forRoot(appRoutes);
// #enddocregion
/* A link parameters array
@@ -1,4 +1,5 @@
// #docregion
import { ModuleWithProviders } from '@angular/core';
// #docregion import-router
import { Routes, RouterModule } from '@angular/router';
// #enddocregion import-router
@@ -32,4 +33,4 @@ export const appRoutingProviders: any[] = [
CanDeactivateGuard
];
export const routing = RouterModule.forRoot(appRoutes);
export const routing: ModuleWithProviders = RouterModule.forRoot(appRoutes);
@@ -1,4 +1,5 @@
// #docregion
import { ModuleWithProviders } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { CrisisDetailComponent } from './crisis-detail.component';
@@ -17,5 +18,5 @@ const crisisCenterRoutes: Routes = [
}
];
export const crisisCenterRouting = RouterModule.forChild(crisisCenterRoutes);
export const crisisCenterRouting: ModuleWithProviders = RouterModule.forChild(crisisCenterRoutes);
// #enddocregion routes
@@ -1,4 +1,5 @@
// #docregion
import { ModuleWithProviders } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { CrisisDetailComponent } from './crisis-detail.component';
@@ -24,5 +25,5 @@ const crisisCenterRoutes: Routes = [
}
];
export const crisisCenterRouting = RouterModule.forChild(crisisCenterRoutes);
export const crisisCenterRouting: ModuleWithProviders = RouterModule.forChild(crisisCenterRoutes);
// #enddocregion routes
@@ -1,5 +1,6 @@
// #docplaster
// #docregion
import { ModuleWithProviders } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { CrisisDetailComponent } from './crisis-detail.component';
@@ -38,7 +39,7 @@ const crisisCenterRoutes: Routes = [
}
];
export const crisisCenterRouting = RouterModule.forChild(crisisCenterRoutes);
export const crisisCenterRouting: ModuleWithProviders = RouterModule.forChild(crisisCenterRoutes);
// #enddocregion
/*
@@ -1,5 +1,6 @@
// #docplaster
// #docregion
import { ModuleWithProviders } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { CrisisDetailComponent } from './crisis-detail.component';
@@ -40,7 +41,7 @@ const crisisCenterRoutes: Routes = [
}
];
export const crisisCenterRouting = RouterModule.forChild(crisisCenterRoutes);
export const crisisCenterRouting: ModuleWithProviders = RouterModule.forChild(crisisCenterRoutes);
// #enddocregion
/*
@@ -1,5 +1,6 @@
// #docplaster
// #docregion
import { ModuleWithProviders } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { CrisisCenterComponent } from './crisis-center.component';
@@ -49,4 +50,4 @@ const crisisCenterRoutes: Routes = [
}
];
export const crisisCenterRouting = RouterModule.forChild(crisisCenterRoutes);
export const crisisCenterRouting: ModuleWithProviders = RouterModule.forChild(crisisCenterRoutes);
@@ -1,5 +1,6 @@
// #docplaster
// #docregion
import { ModuleWithProviders } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { CrisisCenterComponent } from './crisis-center.component';
@@ -45,6 +46,6 @@ const crisisCenterRoutes: Routes = [
}
];
export const crisisCenterRouting = RouterModule.forChild(crisisCenterRoutes);
export const crisisCenterRouting: ModuleWithProviders = RouterModule.forChild(crisisCenterRoutes);
// #enddocregion lazy-load-crisis-center
// #enddocregion
@@ -1,4 +1,5 @@
// #docregion
import { ModuleWithProviders } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { HeroListComponent } from './hero-list.component';
@@ -11,5 +12,5 @@ const heroesRoutes: Routes = [
// #enddocregion hero-detail-route
];
export const heroesRouting = RouterModule.forChild(heroesRoutes);
export const heroesRouting: ModuleWithProviders = RouterModule.forChild(heroesRoutes);
// #enddocregion
@@ -1,4 +1,4 @@
import { RouterConfig } from '@angular/router';
import { Routes } from '@angular/router';
import { AppComponent as S0101 } from '../01-01/app';
// import { AppComponent as S0207 } from '../02-07/app';
@@ -27,7 +27,7 @@ import { AppComponent as S0101 } from '../01-01/app';
// import { AppComponent as S0704 } from '../07-04/app';
// import { AppComponent as S0901 } from '../09-01/app';
export const routes: RouterConfig = [
export const routes: Routes = [
{ path: '', redirectTo: '/01-01', pathMatch: 'full' },
{ path: '01-01', component: S0101 },
// { path: '02-07', component: S0207 },
@@ -56,4 +56,3 @@ export const routes: RouterConfig = [
// { path: '07-04', component: S0704 },
// { path: '09-01', component: S0901 },
];
@@ -1,4 +1,5 @@
// #docregion , heroes
// #docregion , heroes, routing
import { ModuleWithProviders } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { HeroesComponent } from './heroes.component';
@@ -9,6 +10,8 @@ const appRoutes: Routes = [
component: HeroesComponent
}
];
// #enddocregion heroes
// #enddocregion heroes, routing
export const routing = RouterModule.forRoot(appRoutes);
// #docregion routing-export
export const routing: ModuleWithProviders = RouterModule.forRoot(appRoutes);
// #enddocregion routing-export
@@ -1,5 +1,6 @@
// #docplaster
// #docregion , heroes
import { ModuleWithProviders } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
// #enddocregion heroes
@@ -39,5 +40,4 @@ const appRoutes: Routes = [
];
// #enddocregion heroes
// #docregion routing
export const routing = RouterModule.forRoot(appRoutes);
export const routing: ModuleWithProviders = RouterModule.forRoot(appRoutes);
@@ -1,4 +1,5 @@
// #docregion
import { ModuleWithProviders } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { DashboardComponent } from './dashboard.component';
@@ -25,4 +26,4 @@ const appRoutes: Routes = [
}
];
export const routing = RouterModule.forRoot(appRoutes);
export const routing: ModuleWithProviders = RouterModule.forRoot(appRoutes);
+2 -2
View File
@@ -106,8 +106,8 @@ include ../_util-fns
There are no **leading slashes** in our **path**. The router parses and builds the URL for us,
allowing us to use relative and absolute paths when navigating between application views.
The `data` property in the second route is a place to store arbitrary data associated to each
specific route. This data is accessible with each activated route and can be used to store
The `data` property in the second route is a place to store arbitrary data associated with each
specific route. This data is accessible within each activated route and can be used to store
items such as page titles, breadcrumb text and other read-only data. We'll use the [resolve guard](#resolve-guard)
to retrieve additional data later in the chapter.
+1 -1
View File
@@ -227,7 +227,7 @@ block router-config-intro
We'll export a `routing` constant initialized using the `RouterModule.forRoot` method applied to our !{_array} of routes.
This method returns a **configured router module** that we'll add to our root NgModule, `AppModule`.
+makeExcerpt('app/app.routing.ts (excerpt)', 'routing')
+makeExcerpt('app/app.routing.1.ts (excerpt)', 'routing-export')
.l-sub-section
:marked