title: Injecting ActivatedRoute in a component constructor
body: <p>I am creating an angular 5 app and want to pass the ActivatedRoute as a parameter in a constructor. Before doing so the app was running, but now I am getting an error:</p>
  
  <blockquote>
    <p>compiler.js:485 Uncaught Error: Can't resolve all parameters for
    DashboardComponent: (?).
        at syntaxError (compiler.js:485)
        at CompileMetadataResolver._getDependenciesMetadata (compiler.js:15700)
        at CompileMetadataResolver._getTypeMetadata (compiler.js:15535)
        at CompileMetadataResolver.getNonNormalizedDirectiveMetadata (compiler.js:15020)
        at CompileMetadataResolver._getEntryComponentMetadata (compiler.js:15848)
        at eval (compiler.js:15829)
        at Array.forEach ()
        at CompileMetadataResolver._getEntryComponentsFromProvider (compiler.js:15828)
        at eval (compiler.js:15783)
        at Array.forEach ()</p>
  </blockquote>
  
  <p>My routing component:</p>
  
  <pre><code>import { NgModule } from '@angular/core';
  import { RouterModule, Routes } from '@angular/router';
  
  import { DashboardComponent } from './components/dashboard/dashboard.component';
  
  const routes: Routes = [
    { path: 'dashboard', component: DashboardComponent },
    { path: '', redirectTo: '/dashboard', pathMatch: 'full' }
  ];
  
  @NgModule({
    imports: [ RouterModule.forRoot(routes) ],
    exports: [ RouterModule ]
  })
  
  export class AppRoutingModule { }
  </code></pre>
  
  <p>The component in cause:</p>
  
  <pre><code>import { Component, OnInit } from '@angular/core';
  import { RouterModule, ActivatedRoute, Routes } from '@angular/router';
  
  import { Player } from "../../player";
  
  @Component({
    selector: 'app-dashboard',
    templateUrl: './dashboard.component.html',
    styleUrls: ['./dashboard.component.css']  
  })
  export class DashboardComponent implements OnInit {  
    private _router;
    model = new Player("");  
    submitted = false;
  
    constructor(router: ActivatedRoute) { 
      this._router = router;
    }
  
    ngOnInit() {
    }
  
    onSubmit() { 
      this.submitted = true;
      this._router.navigate(['/game']);
    }
  
    get diagnostic() { return JSON.stringify(this.model); }
  }
  </code></pre>
  
  <p>App.module.ts</p>
  
  <pre><code>import { BrowserModule } from '@angular/platform-browser';
  import { NgModule } from '@angular/core';
  import { FormsModule }   from '@angular/forms';
  
  import { AppComponent } from './app.component';
  import { MatrixComponent } from './components/matrix/matrix.component';
  import { SquareComponent } from './components/square/square.component';
  import { PlayerComponent } from './components/player/player.component';
  import { BoatContainerComponent } from './components/boat-container/boat-container.component';
  import { AppRoutingModule } from './app-routing.module';
  import { DashboardComponent } from './components/dashboard/dashboard.component';
  import { GameComponent } from './components/game/game.component';
  
  
  @NgModule({
    declarations: [
      AppComponent,
      MatrixComponent,
      SquareComponent,
      PlayerComponent,
      BoatContainerComponent,
      DashboardComponent,
      GameComponent
    ],
    imports: [
      BrowserModule,
      AppRoutingModule,
      FormsModule
    ],
    providers: [],
    bootstrap: [AppComponent]
  })
  export class AppModule { }
  </code></pre>
  
  <p>What's wrong?</p>