• Skip to content
  • Skip to footer

Gizmopress

Web and Mobile App Development

Main navigation

  • Websites
  • Mobile Apps
  • Startup Apps
  • Pricing
  • Our Blog

gizmo / 07/09/2016

Angular 2 HashLocationStrategy “Error Loading” Apples and Oranges

What a pain…!!

I’ve been trying to use HashLocationStrategy in my Angular 2 application to get URLs with a # in (tghe old style URLs) and my Angular application ran fine when I launched it from its original URL
http://localhost:58035/Admin
and I could go to a sub-page like this
http://localhost:58035/Admin/#/adm-products
once the Angular 2 app had loaded.

However, whenever I tried to go to the sub-page URL directly (before angular had been loaded), I got the following error
“boot:Error: patchProperty/desc.set/wrapFn@http://localhost:58035/libs/zone.js/dist/zone.js:794:27
Zone Zone ZoneTask/this.invoke@http://localhost:58035/libs/zone.js/dist/zone.js:433:29

Error loading http://localhost:58035/scripts/boot”

I ‘m using TypeScript and I have a gulp task that turns the boot.ts file into boot.js, I could see that the boot.js file was created under the scripts folder and as I said, the Angular 2 app loaded fine when visiting the original URL.

Took me long enough to figure out what was going on!!!

Turns out I changed from the default location strategy to the Hash Location Strategy later on and set my base location to
<base href=”/Admin/” />

You don’t need a base element when using HashLocationStrategy and I’m pretty sure it would have been quite happy with life if I had taken out the last backslash in that base href… YEP… just tested it now
<base href=”/Admin” />
works fine.

Makes sense right. these are two completely different URL:
http://localhost:58035/Admin/#/adm-products
http://localhost:58035/Admin#/adm-products

 

Filed Under: Mobile App Developer

Footer

Contact Us

Gizmopress NZ
Auckland, 2110
Phone: 09 889 8448

Take that first step to securing your online success

Fill in our Enquiry Form
or
Have a quick chat on 09 889 8448

© 2021 · Gizmopress: App Development Company