How to disable back and forward navigation in AngularJS

I'm using the built in router in Angular.JS to switch between control/template pairs. While switching the pages, the address bar is changed the accordingly. I checked the document, it says AngularJs has synchronized the $location service with the browser address bar.

My issue is I really want to disable the back and forth in my pages. It's because by clicking back and forth, I'm not able to fetch the data to fill the page. Previously with JQuery mobile, I've disabled the URL changes in the address bar. By this way, I have basically disabled the back and forth. However, with AngularJS, is there a way to do that?

I've figured out the issue by myself. To stop page switching triggered by back and forth, a way is to listen on $locationChangeStart event. If you are able to tell it's triggered by back and forth button, disable the page change by invoking event.preventDefault();.

As long as how to tell whether a page change is triggered by history button or by your logic, since in my main service, I have the logic to control page change. Hence, it's not a problem for me.

No. It is natural for the users of a web app to use back and forward buttons to navigate. In a pure jQuery app people use various jQuery plugins to enable browser history because by default jQuery does not do anything to support browser history. Therefore angularJS maintains browser history out of the box.

You can add parameters to the URL to populate the data when the user uses back and forward buttons to navigate. There is no better way to support back and forward buttons for navigation.