각도 지연로드 라우팅은 항상 와일드 카드 모듈로 이동합니다

Question

여러 개의 모듈이있는 새로운 Angular 응용 프로그램을 개발 중입니다. 나는 여전히 내 경로를 올바르게 찾으려고 애를 쓰고있다. 다음 (단순화 된) 예에서는 StoreModule을 게으른로드하려고합니다. URL이 제공되지 않으면 내 신청서가 /store으로 리디렉션되기를 바랍니다. 잘못된 URL이 주어지면 NotFoundComponent이 표시되기를 바랍니다. 그러나 현재 구성에서는 URL에 관계없이 NotFoundComponent이 항상 표시됩니다. 너희들 내가 뭘 잘못하고 있는지 알아?

이것은 내 app.module.ts 파일입니다. NotFoundModule에서 제공된 RouterModule 만 사용하면 URL 일치가 이루어지지 않을 것으로 예상됩니다.

이 내 StoreModule입니다

@NgModule({ 
    declarations: [ 
    AppComponent 
    ], 
    imports: [ 
    BrowserModule, 
    AuthModule, 
    RouterModule.forRoot([ 
     { path: '', redirectTo: 'store', pathMatch: 'full'}, 
     { path: 'store', loadChildren: 'app/store/store.module#StoreModule'}, 
     { path: 'login', component: LoginComponent }, 
    ]), 
    LoginModule, 
    NotfoundModule, 
    ], 
    bootstrap: [AppComponent], 
    exports: [RouterModule] 
}) 
export class AppModule { } 

을 app.module.ts. 만약 내 app.module.ts 모듈에서 NotFoundModule을 주석 처리하면이 모든 것이 예상대로 작동합니다.

store.module.ts

@NgModule({ 
    imports: [ 
    AuthModule, 
    CommonModule, 
    SharedModule, 
    RouterModule.forChild([ 
     { path: '', pathMatch: 'full', redirectTo: 'dashboard' }, 
     { path: 'dashboard', component: DashboardComponent, canActivate: [AuthGuard] }, 
    ]), 
    ], 
    declarations: [StoreTemplateComponent, DashboardComponent] 
}) 
export class StoreModule { } 

notfound.module.ts

@NgModule({ 
    imports: [ 
    CommonModule, 
    RouterModule.forChild([ 
     { 
     path: '**', 
     component: NotfoundComponent 
     } 
    ]) 
    ], 
    declarations: [ NotfoundComponent ], 
}) 
export class NotfoundModule { } 

Answer 1

라우터 설정 확인을 보인다. 살펴볼 한 가지는 이고 '대시 보드'에 AuthGuard가 있고 을 리디렉션해야하며 리디렉션 URL이 잘못되어야합니다 ( ). 그러면 NotFoundComponent로 리디렉션됩니다.

호프가 문제를 해결할 수 있기를 바랍니다.

Answer 2

URL이 제공되지 않으면 응용 프로그램에서/store로 리디렉션해야합니다. 잘못된 URL이 주어지면 NotFoundComponent가 표시되기를 원합니다.

이 경우 요구 사항 인 경우 notfound.module.ts을 제거해야합니다. 또는 현재 설정에서 지연으로로드해야하며 경로에로드하지 않고 앱 모듈에 추가하여 모든로드를 와일드 카드로 처리합니다.

NotfoundComponent을 가지고 기존 경로에 추가 할 수 있습니다.

RouterModule.forRoot([ 
    { path: '', redirectTo: 'store', pathMatch: 'full'}, 
    { path: 'store', loadChildren: 'app/store/store.module#StoreModule'}, 
    { path: 'login', component: LoginComponent }, 
    { path: '**', component: NotfoundComponent } // this should work 
]),