Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

No provider for ActivatedRoute - Angular 2 RC5

After upgrading to Angular 2 RC5 (from RC4) it seems I can no longer inject ActivatedRoute into my components.

ORIGINAL EXCEPTION: No provider for ActivatedRoute!

Here's the relevant piece of code:

import { Component } from '@angular/core';

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

declare var module: {
  id: string;
};

@Component({
  moduleId: module.id,
  selector: 'mds-app',
  templateUrl: 'app.component.html',
  styleUrls: [
      'app.component.css'
  ],
  directives: []
})
export class AppComponent { 

  constructor(private _route: ActivatedRoute) {
    this._route.params.subscribe(params => console.log(_route));
  }
}

and here's my app.module.ts:

import { NgModule }      from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { CommonModule }  from '@angular/common';
import { Routes, RouterModule }  from '@angular/router';

import { AppComponent }  from './app.component';

import { 
    routing, 
    appRoutingProviders 
} from './app.routing';

@NgModule({
  imports:      [ BrowserModule, CommonModule, RouterModule ],
  declarations: [ AppComponent ],
  bootstrap:    [ AppComponent ],
  providers:    [ appRoutingProviders ]
})
export class AppModule { }

I checked the "Tour of Heroes" example and they do the exact same thing, there is no provider declaration for ActivatedRoute so what is going on here I wonder?

like image 373
Thorsten Westheider Avatar asked Aug 14 '16 13:08

Thorsten Westheider


People also ask

How do I set up ActivatedRoute?

Step 1: Import ActivatedRoute from Router module. import { ActivatedRoute } from '@angular/router'; Step 2: Inject ActivatedRoute in constructor. Now we have id in edit_quiz.

Why ActivatedRoute is used in angular?

ActivatedRoutelink. Provides access to information about a route associated with a component that is loaded in an outlet. Use to traverse the RouterState tree and extract information from nodes.

What is the difference between router and ActivatedRoute in angular?

The ActivatedRoute observables are among the exceptions. The ActivatedRoute and its observables are insulated from the Router itself. The Router destroys a routed component when it is no longer needed and the injected ActivatedRoute dies with it.


1 Answers

If you get this error in unit tests, you need to import RouterTestingModule

like image 169
techguy2000 Avatar answered Sep 21 '22 21:09

techguy2000