Lazy loading not working with Angular-cli webpack -
i trying lazy load 1 module getting same issue:
error: cannot match routes. url segment: 'admin'
i using:
angular-cli: 1.0.0-beta.19-3 node: 6.7.0 os: win32 x64
"ng2-bootstrap": "^1.1.16",
package.json
"dependencies": { "@angular/common": "2.1.2", "@angular/compiler": "2.1.2", "@angular/core": "2.1.2", "@angular/forms": "2.1.2", "@angular/http": "2.1.2", "@angular/platform-browser": "2.1.2", "@angular/platform-browser-dynamic": "2.1.2", "@angular/router": "~3.1.0", "bootstrap": "^3.3.7", "core-js": "^2.4.1", "ng2-bootstrap": "^1.1.16", "ng2-sidebar": "^1.6.2", "rxjs": "5.0.0-beta.12", "ts-helpers": "^1.1.1", "zone.js": "^0.6.23" }, "devdependencies": { "@types/jasmine": "^2.2.30", "@types/node": "^6.0.42", "angular-cli": "1.0.0-beta.19-3", "codelyzer": "1.0.0-beta.1", "jasmine-core": "2.4.1", "jasmine-spec-reporter": "2.5.0", "karma": "1.2.0", "karma-chrome-launcher": "^2.0.0", "karma-cli": "^1.0.1", "karma-jasmine": "^1.0.2", "karma-remap-istanbul": "^0.2.1", "protractor": "4.0.9", "ts-node": "1.2.1", "tslint": "3.13.0", "typescript": "~2.0.3", "webdriver-manager": "10.2.5" }
app.routing.ts
const adminroutes: routes = [ { path: 'admin', loadchildren: 'app/admin/admin.module#adminmodule', canload: [loginauth] } ]; const routes: routes = [ {path: '', redirectto: '/login', pathmatch: 'full'}, ...loginroutes, ...adminroutes ]; export const routing: modulewithproviders = routermodule.forroot(routes);
app.module.ts
@ngmodule({ declarations: [..], imports: [...,ng2components,routing,loginmodule], providers: [loginservice, loginauth], bootstrap: [appcomponent] }) export class appmodule { }
admin.routing.ts
const adminroutes: routes = [ { path: '', component: admincomponent, canactivate: [loginauth], children: [ { path: 'admin', canactivatechild: [loginauth], children: [ {path: 'users', component: usercomponent}, {path: 'dashboard', component: admindashboardcomponent}, {path: '', redirectto: '/admin/dashboard', pathmatch: 'full'} ] } ] } ]; export const adminrouting: modulewithproviders = routermodule.forchild(adminroutes);
if importing adminmodule in @ngmodule it's working fine, in case lazyloading not work should do?
i tried following workaround it's still not working me.
i making mistake here
const adminroutes: routes = [ { path: '', component: admincomponent, canactivate: [loginauth], children: [ { path: 'admin', // <<<<<<<<=========== here should this: '' not 'admin' canactivatechild: [loginauth], children: [ {path: 'users', component: usercomponent}, {path: 'dashboard', component: admindashboardcomponent}, {path: '', redirectto: '/admin/dashboard', pathmatch: 'full'} ] } ] } ];
doing working me
const adminroutes: routes = [ { path: '', component: admincomponent, canactivate: [loginauth], children: [ { path: '', canactivatechild: [loginauth], children: [ {path: 'users', component: usercomponent}, {path: 'dashboard', component: admindashboardcomponent}, {path: '', redirectto: '/admin/dashboard', pathmatch: 'full'} ] } ] } ];
Comments
Post a Comment