Lazyloadルートを使用しようとしましたが、ネストしました。しかし、私はまだ2レベルのルートでモジュールを見つけることができないというエラーを取得します。ここで角2 - ネストされたルートでモジュールが見つかりません
は私の構文です:
app.module.ts:
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import { routing } from './app.routes';
import { AppComponent } from './app.component';
import { RouterModule } from '@angular/router';
@NgModule({
declarations: [
AppComponent,
AuthComponent
],
imports: [
BrowserModule,
FormsModule,
HttpModule,
routing
],
exports: [RouterModule],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
app.routes.ts
import { Router, RouterModule} from '@angular/router';
import { AuthGuard } from './Auth/Services/auth-guard.service';
import { AuthComponent } from './Auth/auth.component';
export const routing = RouterModule.forRoot([
{ path: '', redirectTo: "portal", pathMatch: 'full'},
{ path: 'portal', loadChildren: './Portal/portal.module#PortalModule'},
{ path: '**', redirectTo: "portal"}
])
ポータル/ portal.module.ts:
import { NgModule } from '@angular/core';
import { routing } from './portal.routes';
import { PortalComponent } from './portal.component';
import { FormsModule,ReactiveFormsModule } from '@angular/forms';
import { RouterModule } from '@angular/router';
import { CommonModule } from '@angular/common';
@NgModule({
imports: [
CommonModule,
FormsModule,
ReactiveFormsModule,
routing
],
exports: [ RouterModule ],
declarations: [
PortalComponent
],
providers: [
]
})
export class PortalModule { }
Portal/portal.routes.ts:
import { Router, RouterModule} from '@angular/router';
import { PortalComponent } from './portal.component';
export const routing = RouterModule.forChild([
{ path: '', redirectTo: "reports"},
// This Part doesn't work
{ path: 'reports', component: PortalComponent, loadChildren: './Portal/Test/test.module#TestModule'},
// --
{ path: '**',component: PortalComponent, pathMatch: 'full'}
])
ポータル/テスト/ test.module.ts:
import { NgModule } from '@angular/core';
import { routing } from './test.routes';
import { TestComponent } from './test.component';
import { FormsModule,ReactiveFormsModule } from '@angular/forms';
import { RouterModule } from '@angular/router';
import { CommonModule } from '@angular/common';
@NgModule({
imports: [
CommonModule,
FormsModule,
ReactiveFormsModule,
routing
],
exports: [ RouterModule ],
declarations: [
TestComponent
],
providers: [
]
})
export class TestModule { }
ポータル/テスト/ test.routes:
import { Router, RouterModule} from '@angular/router';
import { TestComponent } from './test.component';
export const routing = RouterModule.forChild([
{ path: '', redirectTo: "reports"},
{ path: 'reports', component: TestComponent},
])
マイエラー:
EXCEPTION: Uncaught (in promise): Error: Cannot find module './Portal/Test/test.module'.
Error: Cannot find module './Portal/Test/test.module'.
マイ彼はなぜモジュールを見つけられないのですか? 私は他のパスも試しましたが、これは本当に私が考えることができる唯一のものです。
修正するには何が必要か、これを行うには角度2が必要ですか?
(NGはビルドでないサーブでエラーがちょうどtestetされる|クロームとTestet)これは役立つかもしれないが、私は、モジュールのやり方は、すべてのモジュールファイルindex.tsに名前を付けることで、単に指定した場合
でしたか? {path: 'reports'、コンポーネント:PortalComponent、loadChildren: './Test/test.module#TestModule'}? –
いいえ、私は本当にすべてのものを試しました –
なぜあなたはこのコンポーネントを持っていますか?PortalComponent? –