2016-07-26 44 views
0

我遇到了RC3路由器的問題,我遇到的錯誤是:無法解析RouteParams的所有參數:(?)此處是我的代碼:錯誤無法解析RouteParams的所有參數:(?)

//route.ts

import {provideRouter, RouterConfig} from '@angular/router'; 
import {HomeComponent} from './components/home.component'; 
import {ActionsComponent} from './components/actions.component'; 
import {TasksComponent} from './components/tasks.component'; 
import {DetailsComponent} from './components/details.component'; 
import {ActionFormComponent} from './forms/action-form.component'; 
import {TaskFormComponent} from './forms/task-form.component'; 
import {ActionViewFormComponent} from './forms/action-view-form.component'; 
import {TaskViewFormComponent} from './forms/task-view-form.component'; 


    export const appRoutes: RouterConfig = [ 

     {path:'', component:HomeComponent}, 

     {path:'actions',component:ActionsComponent}, 
     {path:'actions/:id',component:ActionFormComponent}, 
     {path:'actions/new', component:ActionFormComponent}, 
     {path:'actionview',component:ActionViewFormComponent}, 

     {path:'tasks',component:TasksComponent}, 
     {path:'tasks/:id',component:TaskFormComponent}, 
     {path:'tasks/new', component:TaskFormComponent}, 
     {path:'taskview',component:TaskViewFormComponent} 

     // ,  {path:'*other',component:HomeComponent} 

]; 

export const APP_ROUTER_PROVIDER = provideRouter(appRoutes); 

//boot.ts

import {bootstrap} from '@angular/platform-browser-dynamic'; 
import {HTTP_PROVIDERS, Http} from '@angular/http'; 
import {provideRouter} from '@angular/router'; 

import {APP_ROUTER_PROVIDER} from './routes'; 

import {AppComponent} from './app.component'; 

bootstrap(AppComponent, [APP_ROUTER_PROVIDER, HTTP_PROVIDERS]); 

// appComponent

import {Component} from '@angular/core'; 
import {PostService} from './services/post.service'; 
import { Observer } from 'rxjs/Observer'; 
import {Input} from '@angular/core'; 
import {HTTP_PROVIDERS, Jsonp} from '@angular/http'; 
import {Http, Headers, BaseRequestOptions, RequestOptions} from '@angular/http'; 
import {NavBarComponent} from './components/navbar.component'; 
import {OnInit, Output} from '@angular/core'; 

import { provideRouter, RouterConfig, ROUTER_DIRECTIVES, ActivatedRoute, Router } from '@angular/router'; 
import { RouterLink, RouteParams, ROUTER_PROVIDERS } from '@angular/router-deprecated'; 

@Component({ 
    selector: 'my-app', 
    template: ` 
    <navbar></navbar> 

    <div class="container"> 
     <router-outlet></router-outlet> 
    </div> 
    `, 
    directives:[NavBarComponent, ROUTER_DIRECTIVES, RouterLink], 
    providers:[PostService, HTTP_PROVIDERS, ROUTER_DIRECTIVES] 

,並在我的導航欄的模板,我做這樣的路由器鏈接:

<li><a [routerLink]= "['actions/']" routerLinkActive="active">Actions</a></li> 
     <li><a [routerLink]="['tasks/']" routerLinkActive="active">Tasks</a></li> 

//Package.json

{ 
    "name": "angular2-quickstart", 
    "version": "1.0.0", 
    "scripts": { 
    "start": "tsc && concurrently \"npm run tsc:w\" \"npm run lite\" ", 
    "lite": "lite-server", 
    "postinstall": "typings install", 
    "tsc": "tsc", 
    "tsc:w": "tsc -w", 
    "typings": "typings" 
    }, 
    "license": "ISC", 
    "dependencies": { 

    "@angular/compiler": "2.0.0-rc.3", 
    "@angular/core": "2.0.0-rc.3", 
    "@angular/common": "2.0.0-rc.3", 
    "@angular/forms": "^0.1.0", 

    "@angular/http": "2.0.0-rc.3", 
    "@angular/platform-browser": "2.0.0-rc.3", 
    "@angular/platform-browser-dynamic": "2.0.0-rc.3", 
    "@angular/router": "3.0.0-alpha.8", 
    "@angular/router-deprecated": "2.0.0-rc.2", 
    "es6-shim": "0.35.1", 
    "es6-promise": "3.2.1", 

    "reflect-metadata": "0.1.3", 
    "rxjs": "5.0.0-beta.6", 
    "systemjs": "0.19.26", 
    "zone.js": "0.6.12" 
    }, 
    "devDependencies": { 
    "concurrently": "^2.0.0", 
    "lite-server": "^2.2.0", 
    "typescript": "^1.8.10", 
    "typings":"^0.8.1" 
    } 
} 
+0

爲什麼混合舊路由器和新路由器? –

+0

我沒有故意這樣做,因爲我從我的測試版升級到rc3,你能告訴我究竟在哪裏以及如何取悅嗎? – Anna

+0

@Anna https://angular.io/docs/ts/latest/guide/router.html – Jai

回答

1

如果u使用角度RC3則U將有使用路線,因爲這: -

{

路徑: '/儀表盤',

名稱: '主頁',

組件:dashboardComponent,

useAsDefault:真正}

在RC 4 U不必須有的名稱財產......但在rc3你必須給路由的名稱屬性以及...

我希望這可以解決你的問題:)

+0

謝謝你的回答,它說名稱是不可分配的類型路由,請參閱我的package.json我編輯了問題... – Anna

+0

只需將[routerLink] =「['actions /']」更改爲[routerLink] =「['actions']」...如果您在動作之後添加/之後,則會搜索該鏈接的下一個參數... :) –

+0

它實際上並沒有工作:( – Anna

相關問題