angular2 RC.1：router.navigate（）不工作

问题描述：

我最近升级我的应用程序从角2.0.0 beta.12到角2.0.0 RC.1。我正在使用router-deprecated模块进行路由。默认登录路由加载后，router.navigate(['Newgateway'])似乎不能正常工作。angular2 RC.1：router.navigate（）不工作

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') 
    } 
}

的概率这里这里是router.navigate()以下调用loginComponent将浏览器URL改为localhost:4001/newgateway但是组件未加载。只有刷新浏览器页面后，才会调用newgatewayComponent构造函数。

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

欣赏任何指针。

我建议你创建一个plnkr来显示问题。然后检查新的路由器功能，看看您是否可以升级... –

您可能想要考虑这个问题一次http://stackoverflow.com/questions/37192628/history-forward-backward-button-doesnt-work-with -angular-2-router/37432091 –

答

确定想通了..错过了以下问题在我的package.json依赖

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

为什么要使用这些依赖关系？ –

答

我想你内斯添加/但问题并没有提供足够的信息，以确保

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

尝试使用/ Newgateway ..没有帮助..代码正在与beta 12虽然..控制台上也没有错误。请让我知道如果需要任何澄清..谢谢 – user3869623

没有一个运行的例子很难推理路由。你可以创建一个Plunker重现吗？ –

答

假设你在引导函数中包含了ROUTER_PROVIDERS，你应该从LoginFormComponent.ts中的提供者中删除它。

angular2 RC.1：router.navigate（）不工作

相关推荐