AngularJS is putting forward slash / after hash tag

Question

I'm trying to use AngularJS $anchorScroll with $location.hash. However, when I set the hash, AngularJS adds a forward slash, / after it.

For example, the url is: http://localhost:13060/Dashboard. When I don't include the AngularJS library, I can click the link, #contact, and go to http://localhost:13060/Dashboard#contact.

But when I include AngularJS and click the link, it goes to http://localhost:13060/Dashboard#/contact preventing $anchorScroll from working.

Edit $anchorScroll not working

The starting URL is http://localhost:13060/Category. When I add a category, it should go to http://localhost:13060/Category#/#id (where id is the new id) and scroll down the page to it. The URL is correctly updating but $anchorScroll is not scrolling.

 //jump to new category
 $location.path("");
 $location.hash(cat.ID);
 $anchorScroll();

Answer 1

Unless you use html5mode, which removes the hash from angular routing, you will have 2 hashes, one for angular routing and other for anchors.

http://localhost:13060/Dashboard#/#contact

Assuming you had a route path set as /profiles and anchor was in that view the url would look like:

http://localhost:13060/Dashboard#/profiles#contact