angular - Angular2, RouteParams not working -

i'm getting error causing lots of frustration. here's running with:

• asp.net core 1.0 rc1
• angular2, 2.0.0-beta.15
• typescript, 1.7.6.0

---

the error(s):

angular 2 running in development mode. call enableprodmode() enable production mode. attempting redirect to: /design/0deac46a-7f58-49f9-b67e-2c187dfa49a7/ navigated http://localhost:5000/ exception: cannot resolve parameters 'routeparams'(?). make sure parameters decorated inject or have valid type annotations , 'routeparams' decorated injectable. exception: cannot resolve parameters 'routeparams'(?). make sure parameters decorated inject or have valid type annotations , 'routeparams' decorated injectable. exception: error: uncaught (in promise): cannot resolve parameters 'routeparams'(?). make sure parameters decorated inject or have valid type annotations , 'routeparams' decorated injectable. exception: error: uncaught (in promise): cannot resolve parameters 'routeparams'(?). make sure parameters decorated inject or have valid type annotations , 'routeparams' decorated injectable. stacktrace: error: uncaught (in promise): cannot resolve parameters 'routeparams'(?). make sure parameters decorated inject or have valid type annotations , 'routeparams' decorated injectable.     @ resolvepromise (angular2-polyfills.js:602)     @ angular2-polyfills.js:638     @ zonedelegate.invoketask (angular2-polyfills.js:423)     @ object.ngzoneimpl.inner.inner.fork.oninvoketask (angular2.js:2118)     @ zonedelegate.invoketask (angular2-polyfills.js:422)     @ zone.runtask (angular2-polyfills.js:320)     @ drainmicrotaskqueue (angular2-polyfills.js:541)     @ xmlhttprequest.zonetask.invoke (angular2-polyfills.js:493) unhandled promise rejection: cannot resolve parameters 'routeparams'(?). make sure parameters decorated inject or have valid type annotations , 'routeparams' decorated injectable. ; zone: angular ; task: promise.then ; value: noannotationerror {message: "cannot resolve parameters 'routeparams'(?)… 'routeparams' decorated injectable.", stack: "error: cannot resolve parameters 'routepar…//localhost:5000/js/angular2/angular2.js:9448:46)"} error: uncaught (in promise): cannot resolve parameters 'routeparams'(?). make sure parameters decorated inject or have valid type annotations , 'routeparams' decorated injectable.(…) unhandled promise rejection: cannot resolve parameters 'routeparams'(?). make sure parameters decorated inject or have valid type annotations , 'routeparams' decorated injectable. ; zone: <root> ; task: promise.then ; value: noannotationerror {message: "cannot resolve parameters 'routeparams'(?)… 'routeparams' decorated injectable.", stack: "error: cannot resolve parameters 'routepar…//localhost:5000/js/angular2/angular2.js:9448:46)"} error: uncaught (in promise): cannot resolve parameters 'routeparams'(?). make sure parameters decorated inject or have valid type annotations , 'routeparams' decorated injectable.(…) 

i have abstract base class has 2 subclasses, acting angular2 components. each have constructor takes routeparams instance. subclass 1 works fine, subclass 2 fails load error message above.

the routedefinition asyncroute defined path so: path: '/:appid/:customerid/'

here screen capture error thrown in angular when attempts reflect on routeparams.

---

base class:

import {component, oninit} "angular2/core"; import {routeparams, location} "angular2/router"; import {customerservice} "../../shared/services/customer.service";  @component({     providers: [customerservice] })  export abstract class basecustomerselectorcomponent implements oninit {     protected params: routeparams;      constructor(private customerservice: customerservice,                 private routeparams: routeparams,                 private nglocation: location) {         this.params = routeparams;     }      ngoninit() {         // omitted..     } } 

subclass two:

import {component} "angular2/core"; import {routeparams, location} "angular2/router"; import {basecustomerselectorcomponent} "../../shared/components/base-customer-selector.component"; import {customerservice} "../../shared/services/customer.service";  @component({     selector: "customer-selector",     templateurl: "app/shell/templates/customer-selector.html",     styleurls: ["app/shell/styles/customer-selector.css"],     providers: [customerservice, settings, routeparams] })  export class customerselectorcomponent extends basecustomerselectorcomponent {     constructor(customerservice: customerservice,                 routeparams: routeparams,                 nglocation: location) {         super(customerservice, routeparams, nglocation);     } } 

routeparams can injected in components added router.

in other components can inject router , subscribe it`

  constructor(private router:router) {     router.subscribe(route => {       console.debug(this.router.currentinstruction.component.params);     });   } 

otherwise @kemsky said.

ensure router_providers added on root component (or alternatively in bootstrap())