Hello All,
I have a problem with child routes on Angular 2. I have defined a routing as follows,
accounts-routing.module.ts
import { NgModule } from ‘@angular/core’;
import { RouterModule, Routes } from ‘@angular/router’;
import { AccountsComponent } from ‘./accounts.component’;
import { ForgotComponent } from ‘./forgot/forgot.component’;
import { RegisterComponent } from ‘./register/register.component’;
import { LoginComponent } from ‘./login/login.component’;
const accountsRoutes: Routes = [
{
path: ‘’,
component: AccountsComponent,
children: [
{
path: ‘’,
component: AccountsComponent
},
{
path: ‘forgot’,
component: ForgotComponent
},
{
path: ‘login’,
component: LoginComponent
},
{
path: ‘register’,
component: RegisterComponent
}
]
}
];
@NgModule({
imports: [
RouterModule.forChild(accountsRoutes)
],
exports: [
RouterModule
]
})
export class AccountsRoutingModule {}
And the following one is my main routing module.
app-routing.module.ts
import { NgModule } from ‘@angular/core’;
import { Routes, RouterModule } from ‘@angular/router’;
import { Meteor } from ‘meteor/meteor’;
import { HomeComponent } from ‘./home/home.component’;
const appRoutes: Routes = [
{
path: ‘’,
component: HomeComponent
},
{
path: ‘home’,
component: HomeComponent
},
{
path: ‘accounts’,
loadChildren: ‘client/imports/app/accounts/accounts.module#AccountsModule’
}
];
export const ROUTES_PROVIDERS = [{
provide: ‘canActivateForLoggedIn’,
useValue: () => !! Meteor.userId()
}];
@NgModule({
imports: [
RouterModule.forRoot(appRoutes)
],
exports: [
RouterModule
]
})
export class AppRoutingModule {}
Routing is perfectly working while I am not using child routes.
<a routerLink="/">No Route</a>
<a routerLink="/home">Home Route</a>
<a routerLink="/accounts">Accounts Route</a>
But when I route to accounts which has a child route I get the following error.
modules.js:44494 EXCEPTION: Uncaught (in promise): ReferenceError: System is not defined
ReferenceError: System is not defined
at SystemJsNgModuleLoader.loadAndCompile (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:48456:20)
at SystemJsNgModuleLoader.load (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:48449:64)
at RouterConfigLoader.loadModuleFactory (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:61603:76)
at RouterConfigLoader.load (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:61595:52)
at MergeMapSubscriber.project (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:62339:82)
at MergeMapSubscriber._tryNext (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:11285:27)
at MergeMapSubscriber._next (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:11275:18)
at MergeMapSubscriber.Subscriber.next (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:2680:18)
at ScalarObservable._subscribe (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:5763:24)
at ScalarObservable.Observable.subscribe (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:1577:27)
modules.js?hash=003d58a…:44499 ORIGINAL STACKTRACE:ErrorHandler.handleError @ modules.js?hash=003d58a…:44499next @ modules.js?hash=003d58a…:47959schedulerFn @ modules.js?hash=003d58a…:47257SafeSubscriber.__tryOrUnsub @ modules.js?hash=003d58a…:2814SafeSubscriber.next @ modules.js?hash=003d58a…:2763Subscriber._next @ modules.js?hash=003d58a…:2716Subscriber.next @ modules.js?hash=003d58a…:2680Subject.next @ modules.js?hash=003d58a…:1406EventEmitter.emit @ modules.js?hash=003d58a…:47249NgZone.triggerError @ modules.js?hash=003d58a…:47553onHandleError @ modules.js?hash=003d58a…:47532ZoneDelegate.handleError @ modules.js?hash=003d58a…:22040Zone.runGuarded @ modules.js?hash=003d58a…:21935_loop_1 @ modules.js?hash=003d58a…:22216drainMicroTaskQueue @ modules.js?hash=003d58a…:22225ZoneTask.invoke @ modules.js?hash=003d58a…:22143
modules.js?hash=003d58a…:44500 Error: Uncaught (in promise): ReferenceError: System is not defined
ReferenceError: System is not defined
at SystemJsNgModuleLoader.loadAndCompile (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:48456:20)
at SystemJsNgModuleLoader.load (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:48449:64)
at RouterConfigLoader.loadModuleFactory (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:61603:76)
at RouterConfigLoader.load (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:61595:52)
at MergeMapSubscriber.project (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:62339:82)
at MergeMapSubscriber._tryNext (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:11285:27)
at MergeMapSubscriber._next (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:11275:18)
at MergeMapSubscriber.Subscriber.next (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:2680:18)
at ScalarObservable._subscribe (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:5763:24)
at ScalarObservable.Observable.subscribe (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:1577:27)
at resolvePromise (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:22272:31)
at http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:22249:13
at ZoneDelegate.invoke (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:22036:26)
at Object.onInvoke (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:47511:41)
at ZoneDelegate.invoke (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:22035:32)
at Zone.run (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:21918:43)
at http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:22306:57
at ZoneDelegate.invokeTask (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:22069:35)
at Object.onInvokeTask (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:47502:41)
at ZoneDelegate.invokeTask (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:22068:40)
------------- Elapsed: 1 ms; At: Sun Nov 20 2016 18:41:10 GMT+0300 (Türkiye Standart Saati) -------------
at Object.onScheduleTask (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:23324:18)
at ZoneDelegate.scheduleTask (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:22046:49)
at Zone.scheduleMicroTask (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:21972:39)
at scheduleResolveOrReject (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:22304:14)
at resolvePromise (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:22267:21)
at http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:22249:13
at http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:64133:29
at ZoneDelegate.invoke (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:22036:26)
------------- Elapsed: 0 ms; At: Sun Nov 20 2016 18:41:10 GMT+0300 (Türkiye Standart Saati) -------------
at Object.onScheduleTask (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:23324:18)
at ZoneDelegate.scheduleTask (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:22046:49)
at Zone.scheduleMicroTask (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:21972:39)
at scheduleResolveOrReject (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:22304:14)
at ZoneAwarePromise.then (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:22390:17)
at http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:64111:22
at new ZoneAwarePromise (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:22322:29)
at Router.runNavigate (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:64057:20)
------------- Elapsed: 3 ms; At: Sun Nov 20 2016 18:41:10 GMT+0300 (Türkiye Standart Saati) -------------
at Object.onScheduleTask (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:23324:18)
at ZoneDelegate.scheduleTask (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:22046:49)
at Zone.scheduleMicroTask (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:21972:39)
at scheduleResolveOrReject (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:22304:14)
at ZoneAwarePromise.then (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:22390:17)
at Router.scheduleNavigation (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:64048:38)
at Router.navigateByUrl (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:63992:29)
at RouterLinkWithHref.onClick (http://localhost:3000/packages/modules.js?hash=003d58a646634ee380eaadf92d2efddfcf0cd7ee:64665:25)ErrorHandler.handleError @ modules.js?hash=003d58a…:44500next @ modules.js?hash=003d58a…:47959schedulerFn @ modules.js?hash=003d58a…:47257SafeSubscriber.__tryOrUnsub @ modules.js?hash=003d58a…:2814SafeSubscriber.next @ modules.js?hash=003d58a…:2763Subscriber._next @ modules.js?hash=003d58a…:2716Subscriber.next @ modules.js?hash=003d58a…:2680Subject.next @ modules.js?hash=003d58a…:1406EventEmitter.emit @ modules.js?hash=003d58a…:47249NgZone.triggerError @ modules.js?hash=003d58a…:47553onHandleError @ modules.js?hash=003d58a…:47532ZoneDelegate.handleError @ modules.js?hash=003d58a…:22040Zone.runGuarded @ modules.js?hash=003d58a…:21935_loop_1 @ modules.js?hash=003d58a…:22216drainMicroTaskQueue @ modules.js?hash=003d58a…:22225ZoneTask.invoke @ modules.js?hash=003d58a…:22143
As I know we all use commonjs as module not systemjs. Why do I get this error any one got any idea?
Please help me
Thanks in advance.