所以我在AuthenticationService中有以下代码.检查登录凭据后,用户将被重定向到其配置文件:
authentication.service.ts
:
redirectUser(username:string):void { // Redirect user to profile on successful login this.router.navigate(['../Profile/Feed', {username: username}]); }
这一切都很好,但自从我在里面引入了一些子路由后ProfileComponent
,我遇到了一些错误.首先,这是我的AppComponent与RouteConfig:
app.ts
:
import {Component, ViewEncapsulation} from 'angular2/core'; import {RouteConfig,ROUTER_DIRECTIVES} from 'angular2/router'; import {HTTP_PROVIDERS} from 'angular2/http'; import {HomeComponent} from '../home/home'; import {AuthenticationService} from '../../services/authentication.service'; import {LoginComponent} from '../login/login'; import {ProfileComponent} from '../profile/profile'; import {ProfileService} from '../../services/profile.service'; @Component({ selector: 'app', viewProviders: [AuthenticationService, ProfileService, HTTP_PROVIDERS], encapsulation: ViewEncapsulation.None, directives: [ ROUTER_DIRECTIVES ], templateUrl: './components/app/app.html' }) @RouteConfig([ {path: '/', component: HomeComponent, as: 'Home'}, {path: '/inloggen', component: LoginComponent, as: 'Login'}, {path: '/profile/:username/...', component: ProfileComponent, as: 'Profile'} ]) export class AppComponent { ... }
如您所见,在ProfileComponent中定义了一些新路由.如下图所示:
ProfileComponent.ts
:
import {Component, OnInit} from 'angular2/core'; import {RouteConfig,ROUTER_DIRECTIVES, RouteParams, RouterLink, RouterOutlet} from 'angular2/router'; import {ProfileService} from '../../services/profile.service'; import {PROFILE_IMAGES} from '../../constants/constants'; import {WorkoutsComponent} from '../workouts/workouts'; import {FeedComponent} from '../feed/feed'; interface IProfileVM { username: string; profileUser: Object; getProfileData(username:string): void; } @Component({ selector: 'profile', templateUrl: './components/profile/profile.html', directives: [RouterOutlet, RouterLink], providers: [ProfileService] }) @RouteConfig([ {path: '/nieuwsfeed', component: FeedComponent, as: 'Feed'}, {path: '/workouts', component: WorkoutsComponent, as: 'Workouts'} ]) export class ProfileComponent implements OnInit, IProfileVM { public username:string; public profileUser:any; constructor(private _profileService:ProfileService, private _params:RouteParams) { this.username = this._params.get('username'); } ngOnInit() { this.getProfileData(this.username); } getProfileData(username) { // Do stuff.. } }
所以这里的问题是,在我在ProfileComponent中引入一些子路由之前,一切正常.用户被重定向,用户名出现在URL中,一切正常.但是因为我添加了这些子路由,我收到以下错误:
"Route generator for 'username' was not included in parameters passed."
很高兴有人可以帮助我!提前致谢!