Question

无法使用this.router.navigate。

这是我的： app.module.ts

    import {NgModule, NgModuleMetadataType}      from '@angular/core';
    import { BrowserModule } from '@angular/platform-browser';
    import {FormsModule}    from '@angular/forms';
    import { HttpModule } from '@angular/http';
    ...
    import {routing} from "./app.routing";
    import {entry} from "./entry.component";
imports: [ 
        BrowserModule,
        FormsModule,
        routing,
        HttpModule,
    ],

测试组件

import { Component } from '@angular/core';
import {HttpClient} from "./HttpClient.component";
import {Router} from "@angular/router-deprecated";

@Component({
    templateUrl: 'templates/entry.html'
})
export class entry {
    ...
    constructor(head:HeaderComponent, private httpClient: HttpClient, private router: Router) {
        this.httpClient = httpClient;
    }
    nav_test(){
        this.router.navigate(['search']);
    }
}

和app.routing

import { Routes, RouterModule } from '@angular/router';
const appRoutes: Routes = [
    {
        path: '',
        redirectTo: '/home',
        pathMatch: 'full',
    },
    {
        path: 'home',
        component: HomeComponent
    },
    {
        path: 'search',
        component: SearchComponent

    }

];
export const routing = RouterModule.forRoot(appRoutes, {useHash: true});

最后我有这个错误：

EXCEPTION：错误：未捕获（在承诺中）：EXCEPTION：./entry中出错 class entry_Host - 内联模板：0：0 原始例外：没有路由器的提供商！

提前谢谢！

Answer 1

问题在于您的测试组件导入，

您正在使用

import {Router} from "@angular/router-deprecated";

你应该使用，

import { Router } from '@angular/router';

希望这会有所帮助!!

Answer 2

不确定useHash：true是如何工作的，但是我在@NgModule中指定了位置策略：

providers:[{provide: LocationStrategy, useClass: HashLocationStrategy}]

我使用最新的路由器，而不是弃用的路由器。

正在运行的RC.6代码示例如下：https://github.com/Farata/angular2typescript/tree/master/chapter3/router_samples

原始例外：没有路由器提供商！角度2 RC5

2 个答案: