带服务的角度4路由

我将Angular 4和REST应用程序与服务连接时出错。

以下是错误:

compiler.es5.js:1694 Uncaught Error: Can't resolve all parameters for TypeaheadComponent: (?, [object Object], [object Object]).
    at syntaxError (compiler.es5.js:1694)
    at CompileMetadataResolver._getDependenciesMetadata (compiler.es5.js:15781)
    at CompileMetadataResolver._getTypeMetadata (compiler.es5.js:15649)
    at CompileMetadataResolver.getNonNormalizedDirectiveMetadata (compiler.es5.js:15244)
    at CompileMetadataResolver._getEntryComponentMetadata (compiler.es5.js:15903)
    at eval (compiler.es5.js:15889)
    at Array.forEach (<anonymous>)
    at CompileMetadataResolver._getEntryComponentsFromProvider (compiler.es5.js:15888)
    at eval (compiler.es5.js:15852)
    at Array.forEach (<anonymous>)

我已经反复检查我的路由器设置是否有任何错误,但我自己似乎找不到任何错误。欢迎提出任何建议。

import {Routes, RouterModule } from '@angular/router';
import {NgModule} from '@angular/core';
import {TypeaheadComponent} from "./shared/typeahead-component";
import {DashboardService} from "./services/dashboard-service";

const routes: Routes = [
    {  path: 'typeahead-component/', component: TypeaheadComponent }
]

@NgModule({
  imports: [RouterModule.forRoot(routes, { enableTracing: true } )],
    exports: [RouterModule],
    providers: [DashboardService]
})

export class AppRoutingModule {

}

这是我的应用程序。单元ts代码:

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule } from '@angular/forms';
import { AppComponent} from './app.component';
import { AppRoutingModule} from './app-routing.module';
import {RouterModule, Routes} from '@angular/router';
import { TypeaheadComponent } from './shared/typeahead-component';
import { HttpModule} from'@angular/http';
import {DashboardService} from "./services/dashboard-service";



@NgModule({
  declarations: [
    AppComponent,
    TypeaheadComponent
  ],
  imports: [
    BrowserModule,
    FormsModule,
    AppRoutingModule,
    RouterModule,
      HttpModule
  ],
  providers: [ RouterModule, DashboardService],
  bootstrap: [AppComponent],
})
export class AppModule { }

这是我的typeahead组件。ts相关代码:

  constructor( private route: Route, private router: Router, private dashboardHttpService: DashboardService) {
      this.router.navigate(['typeahead-component/']);
      this.edit();
  }

这是我的仪表板服务。ts相关代码:

constructor(private http: Http, private route: ActivatedRoute, private router: Router) {
    this.router.navigate(['typeahead-component/']);
  }

提前道歉-我没有为此创建plunkr,因为我对使用plunkr非常陌生。

我将非常感谢任何我正在努力实现的工作示例。

非常感谢。