2016-08-11 98 views
5

angular2 rc.5angular2路線類型錯誤:無法讀取屬性「forRoot」

我得到TypeError: Cannot read property 'forRoot' of undefined(…) 當我調查我發現,RouterModule是在執行過程中undefined

以下是我app.route.ts

import {Routes, RouterModule } from '@angular/router'; 

//const routes: Routes = []; 
import {HelloComponent} from './hello.component'; 
import {IncComponent} from './inc.component'; 
import {AdditionComponent} from './addition.component'; 
import {RomanComponent} from './roman.component'; 

let routes: Routes = [ 

    { 
     path: 'hello', 
     component: HelloComponent 
    }, 
    { 
     path: '', 
     redirectTo: '/hello', 
     pathMatch: 'full' 
    }, 
    { 
     path: 'increment', 
     component: IncComponent 
    },{ 
     path: 'adder', 
     component: AdditionComponent 
    },{ 
     path: 'roman', 
     component: RomanComponent 
    } 
]; 


export const routing = RouterModule.forRoot(routes); // error on this line 

以下是我app.module.ts

import { NgModule }  from '@angular/core'; 
import { BrowserModule } from '@angular/platform-browser'; 

import { AppComponent } from './app.component'; 
import {routing} from './app.routes'; 
import {HelloComponent} from './hello.component'; 
import {IncComponent} from './inc.component'; 
import {AdditionComponent} from './addition.component'; 
import {RomanComponent} from './roman.component'; 

@NgModule({ 
    imports:[ 
     BrowserModule, 
     routing 
    ], 
    declarations: [ 
     AppComponent, 
     HelloComponent, 
     IncComponent, 
     AdditionComponent, 
     RomanComponent 
    ], 
    bootstrap: [ AppComponent ] 
}) 
export class AppModule { } 

和main.ts

import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; 
    //import { HTTP_PROVIDERS } from '@angular/http'; 
    import { AppModule } from './app.module'; 

    platformBrowserDynamic().bootstrapModule(AppModule); 
+0

可能的原因js文件是你'systemjs.config.js'文件沒有'路由器module'參考。 – micronyks

+0

你必須只在蹲下生產。在RC5之後,事情變得難以理解。 – micronyks

+0

你找到解決方案嗎? – Yvan

回答

0

package.json 我有從以上回答中複製依賴關係。

{ 
    "dependencies": { 
    "@angular/common": "2.0.0-rc.5", 
    "@angular/compiler": "2.0.0-rc.5", 
    "@angular/core": "2.0.0-rc.5", 
    "@angular/forms": "0.3.0", 
    "@angular/http": "2.0.0-rc.5", 
    "@angular/platform-browser": "2.0.0-rc.5", 
    "@angular/platform-browser-dynamic": "2.0.0-rc.5", 
    "@angular/router": "3.0.0-rc.1", 
    "@angular/router-deprecated": "2.0.0-rc.2", 
    "@angular/upgrade": "2.0.0-rc.5", 
    "systemjs": "0.19.27", 
    "core-js": "^2.4.0", 
    "reflect-metadata": "^0.1.3", 
    "rxjs": "5.0.0-beta.6", 
    "zone.js": "^0.6.12", 
    "angular2-in-memory-web-api": "0.0.15", 
    "bootstrap": "^3.3.6" 
    }, 
    "devDependencies": { 
    "concurrently": "^2.0.0", 
    "lite-server": "^2.2.0", 
    "typescript": "^1.8.10", 
    "typings": "^1.0.4" 
    } 
} 
0

我有完全相同的問題,這是因爲我有角2.

這裏過時的版本是的package.json的先進的日期(在我們發言)版本file:

{ 
    "dependencies": { 
    "@angular/common": "2.0.0-rc.5", 
    "@angular/compiler": "2.0.0-rc.5", 
    "@angular/core": "2.0.0-rc.5", 
    "@angular/forms": "0.3.0", 
    "@angular/http": "2.0.0-rc.5", 
    "@angular/platform-browser": "2.0.0-rc.5", 
    "@angular/platform-browser-dynamic": "2.0.0-rc.5", 
    "@angular/router": "3.0.0-rc.1", 
    "@angular/router-deprecated": "2.0.0-rc.2", 
    "@angular/upgrade": "2.0.0-rc.5", 
    "systemjs": "0.19.27", 
    "core-js": "^2.4.0", 
    "reflect-metadata": "^0.1.3", 
    "rxjs": "5.0.0-beta.6", 
    "zone.js": "^0.6.12", 
    "angular2-in-memory-web-api": "0.0.15", 
    "bootstrap": "^3.3.6" 
    }, 
    "devDependencies": { 
    "concurrently": "^2.0.0", 
    "lite-server": "^2.2.0", 
    "typescript": "^1.8.10", 
    "typings": "^1.0.4" 
    } 
} 

用最新版本更新你的package.json文件,再次運行npm install,它應該可以工作。

你可以得到最新版本here

0

對我來說這是webpack的問題 - 我有2個js文件:vendor.jsapp.js。我正在使用CommonsChunkPlugin加載所需的供應商庫。我將名稱選項設置爲與其中一個入口點相同。這是我以前的配置:

new webpack.optimize.CommonsChunkPlugin({ 
    name: 'common' 
}) 

我已經改變的只有一件事:增加filename選項,並開始工作:

new webpack.optimize.CommonsChunkPlugin({ 
    name: 'common', 
    filename: "vendor.js" 
}) 

我不知道這是不變的情況下,但它解決了我的問題。

1

我有同樣的問題。 也許這是腐爛的,但在我的情況下,問題是在我清除瀏覽器緩存後解決的。

1

我在Visual Studio 2015中的.NET Core Web應用程序中使用了相同的問題。我將包從rc4升級到了rc5,並執行了npm install,並在刷新我的瀏覽器後看到此錯誤。我終於意識到,我忘了將更新後的軟件包從node_modules複製到wwwroot裏面的lib文件夾中(我有一個吞噬任務的人)。運行任務以更新庫後,一切恢復正常。希望這可以幫助某人。

1

我的Visual Studio下運行,但我不得不這樣做以下所有步驟:

  1. 刪除我的垃圾桶,OBJ,node_modules文件夾
  2. NPM安裝
  3. 運行復制我一飲而盡腳本的。各地
  4. 清晰的瀏覽器緩存
相關問題