Hello everybody,
I'm experiencing an issue where a link defined like this in a template:
<a routerLink="skills" [queryParams]="{redirectTo:'lastVisited'}"
[class.navigated-to]="navigation.Skills"><span class="fa fa-medkit"
aria-hidden="true" style="font-size: 0.9em"> Skills</span></a>
works most of the time, but sometimes the router complains with this:
core.js:1448 ERROR Error: Uncaught (in promise): Error: Cannot match any
routes. URL Segment:
'admin/skills/skill-list-type%3FredirectTo%3DlastVisited'
Error: Cannot match any routes. URL Segment:
'admin/skills/skill-list-type%3FredirectTo%3DlastVisited'
at ApplyRedirects.noMatchError (router.js:1719)
at CatchSubscriber.eval [as selector] (router.js:1684)
at CatchSubscriber.error (catchError.js:105)
at MapSubscriber.Subscriber._error (Subscriber.js:131)
at MapSubscriber.Subscriber.error (Subscriber.js:105)
at MapSubscriber.Subscriber._error (Subscriber.js:131)
at MapSubscriber.Subscriber.error (Subscriber.js:105)
at MapSubscriber.Subscriber._error (Subscriber.js:131)
at MapSubscriber.Subscriber.error (Subscriber.js:105)
at LastSubscriber.Subscriber._error (Subscriber.js:131)
at ApplyRedirects.noMatchError (router.js:1719)
at CatchSubscriber.eval [as selector] (router.js:1684)
at CatchSubscriber.error (catchError.js:105)
at MapSubscriber.Subscriber._error (Subscriber.js:131)
at MapSubscriber.Subscriber.error (Subscriber.js:105)
at MapSubscriber.Subscriber._error (Subscriber.js:131)
at MapSubscriber.Subscriber.error (Subscriber.js:105)
at MapSubscriber.Subscriber._error (Subscriber.js:131)
at MapSubscriber.Subscriber.error (Subscriber.js:105)
at LastSubscriber.Subscriber._error (Subscriber.js:131)
at resolvePromise (zone.js:809)
at resolvePromise (zone.js:775)
at eval (zone.js:858)
at ZoneDelegate.invokeTask (zone.js:421)
at Object.onInvokeTask (core.js:4740)
at ZoneDelegate.invokeTask (zone.js:420)
at Zone.runTask (zone.js:188)
at drainMicroTaskQueue (zone.js:595)
at <anonymous>
It took me long time to notice that the query parameters are being
percent-encoded (URL-encoded) in the error. After I noticed it I tried to
replicate the problem by manually encode the parameters in the adress bar
and I got exactly the same error. Now it is clear to me that the problem is
indeed in the encoding. Since I bound the queryParams in the link as it is
shown everywhere around the web (I've revised it many times and it is
indeed *bound* with square brackets) I have no clue why the queryParams get
encoded and on top of that at random (it's like it works flawlessly 95% of
the time and occasionally complains with "Cannot match any routes") so what
I did is to bind (with square brackets) routerLink, instead of assigning a
value to it:
<a [routerLink]="['skills']" [queryParams]="{redirectTo:'lastVisited'}"
[class.navigated-to]="navigation.Skills"><span class="fa fa-medkit"
aria-hidden="true" style="font-size: 0.9em"> Skills</span></a>
I don't know whether that would fix the problem, as the latter pops up at
random.
Has anybody encountered such an issue or know what causes the URL to get
percent-encoded?
Thanks
--
You received this message because you are subscribed to the Google Groups
"Angular and AngularJS discussion" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to angular+unsubscr...@googlegroups.com.
To post to this group, send email to angular@googlegroups.com.
Visit this group at https://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.
