2016-08-12 147 views
1

我想在我的應用程序中實現RC5更改,並且在延遲加載模塊時遇到了一些麻煩。Angular2 RC5延遲加載路由無法找到模塊

這是受影響的文件在我的應用程序的結構:

/app 
    /components/meda/meda.module.ts 
    /components/meda/meda.routing.ts 
    app.routing.ts 

這是我app.routing.ts

const routes: Routes = [ 
    { 
    path: '', 
    redirectTo: 'init', 
    pathMatch: 'full' 
    }, 
    { 
    path: 'init', 
    loadChildren: './components/init/init.module#InitModule' 
    }, 
    { 
    path: 'meda', 
    loadChildren: './components/meda/meda.module#MedaModule' 
    } 
]; 

和我meda.module.ts

@NgModule({ 
    imports: [ routing ], 
}) 
export class MedaModule { } 

我的應用程序加載到init路由的罰款,因爲bootstrap加載InitModule,但一旦我嘗試導航到meda我得到以下

GET http://localhost/web/components/meda/meda.module 404 (Not Found) 

看來它無法找到模塊的位置。我也試過

loadChildren: 'app/components/meda/meda.module#MedaModule' 

但沒有運氣;任何想法我做錯了什麼?

感謝

+0

如果您使用工作流程爲您的發行版在不同的目錄中創建js文件(例如使用gulp)。您必須引用該路徑,而不是在打字稿中導入時使用的路徑。 所以它實際上是服務器上的.js文件的路徑,而不是你應用程序結構中的ts文件,因此是404。 –

+0

但服務器中的文件實際上是在一個bundle.app.js中,這將如何工作呢? – David

+0

延遲加載是關於加載您並不總是需要的實現文件,因此最初不想加載。如果你有bundle.app.js中的代碼,並且在你的應用程序啓動時加載這個文件,那麼你預計什麼時候會加載懶惰,因爲東西已經通過網絡傳輸(只有html文件被延遲加載?)。 –

回答

0

我有同樣的問題,我根據托爾斯滕維耶爾的意見改變了我的路。這是我的文件夾結構來說明;

/wwwroot 
    /app 
    /scripts 

我的.ts文件位於'wwwroot/app'文件夾下。我使用'gulp-typescript'將.ts文件轉換爲'wwwroot/scripts'文件夾下的.js文件。例如,如果你的init.module.ts路徑是:wwwroot/app/components/init/init.module和你的.js文件transpiled到:wwwroot/scripts/components/init/init.module,你應指定如下:

loadChildren: 'wwwroot/scripts/components/init/init.module#InitModule' 

它應該工作,我希望它能幫助。

0

編寫沒有領先的路徑。或./或/

loadChildren: 'components/init/init.module#InitModule' 

地址的起始點是您的html文件的位置。

相關問題