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())
Comments
Post a Comment