angular2 RC.1：router.navigate（）无法正常工作

Question

I recently upgraded my app from Angular 2.0.0-beta.12 to Angular 2.0.0-rc.1 . I am using router-deprecated module for routing. After default login route is loaded, router.navigate(['Newgateway']) doesn't seem to work correctly.

RootComponent

import { Component, provide } from '@angular/core';
import {Router, RouteConfig, ROUTER_DIRECTIVES, ROUTER_PROVIDERS} from '@angular/router-deprecated';
import { LoginComponent } from './loginComponent';
import {NewGatewayComponent} from './newGatewayComponent';

@Component({
    directives: [ROUTER_DIRECTIVES],
    providers: [ROUTER_PROVIDERS],
    selector: 'root-comp',
    template: `<router-outlet></router-outlet>`,
})
@RouteConfig([
    { path: '/newgateway',name: 'Newgateway',component: NewGatewayComponent},    
    { component: LoginComponent, name: 'Login', path: '/login', useAsDefault: true},
    { path: '/', redirectTo: ['/Login']}
])
export class RootComponent{ 

  constructor(private _router: Router) {

  }

}

LoginFormComponent

import { Component, Inject} from '@angular/core';
import { Router, ROUTER_PROVIDERS } from '@angular/router-deprecated';

@Component({
    selector: 'login-form',
    templateUrl: './loginForm.html',
    providers: [ROUTER_PROVIDERS]
})
export class LoginFormComponent { 
    constructor(private _router: Router) {
    }   

    // if login is sucessfull, navigate back to specified URL
    redirect(result: any, loginComp: LoginFormComponent) {
       this._router.navigate(['Newgateway']);
    }
}

NewGatewayComponent

import {Component, provide} from '@angular/core';
@Component({
    selector: 'pi-new-gateway-panel',
    template: `
        <h1>Gateway</h1>
    `,
})
export class NewGatewayComponent {
   constructor() {
     console.log('loaded')
   } 
}

The problem here is that router.navigate() call below in loginComponent changes the browser URL to localhost:4001/newgateway however component is not loaded. Only after browser page is refreshed, newgatewayComponent constructor is invoked.

this._router.navigate(['Newgateway']);

Appreciate any pointers.

Answer 1

我认为您需要添加/但问题并没有提供足够的信息来确保

this._router.navigate(['/Newgateway']);

Answer 2

ok figured out the problem.. missed following dependencies in my package.json

"@angular/compiler": "2.0.0-rc.1",
"@angular/platform-browser": "2.0.0-rc.1",

Answer 3

假设您在引导函数中包含了ROUTER_PROVIDERS，则应将其从LoginFormComponent.ts中的提供程序中删除。