CODEWITHSUNDEEP
angularjs
user1620696
user1620696

Reputation: 11375

Angular JS navigation and the # sign

When creating, for example, dropdown menus I use the # sign on the link that toggles the dropdown. It works just fine with just for that and many other things where I need a link just to do something and stay on the same page.

Now I'm using angular and the problem I face is that when I use this sign on a link it thinks I'm referencing the route for / so that the app goes to the first screen.

How can I deal with this?

Upvotes: 1

Views: 113

Answers (1)

PeterFromCologne
PeterFromCologne

Reputation: 10453

As far as I know another "ugly" workaround is to put href="javascript:;" to avoid the unintended navigation.

Or remove the href altogether but then when you mouseover you have no pointer. you need to add this to your CSS as described on UI Bootstrap page.

From: http://angular-ui.github.io/bootstrap/

Original Bootstrap's CSS depends on empty href attributes to style cursors for several components (pagination, tabs etc.). But in AngularJS adding empty href attributes to link tags will cause unwanted route changes. This is why we need to remove empty href attributes from directive templates and as a result styling is not applied correctly. The remedy is simple, just add the following styling to your application:

.nav, .pagination, .carousel, .panel-title a { cursor: pointer; }

Upvotes: 1

Related Questions