AngularJS Firefox HTML cache

Question

It's being really annoying to develop in Firefox under the AngularJS framework. Why? Because you just refresh and the JavaScript is reloaded, but that's not the case for the HTML many times. So each time you change a single bit in the template, you have to manually clear the cache to be sure that the changes are being applied.

Any idea about why Firefox/Angular is doing that, and how to prevent it?

I tried also the 'Hard Refresh' extension (https://addons.mozilla.org/en-US/firefox/addon/hard-refresh/?src=search) in order to make things easier, and also the Ctrl + F5 combination, but even this is not enough to really refresh the page. The only way I found so far is via the preferences menu, in the privacy tab, selecting (only) the cache to be cleared.

Answer 1

Did you try to use $templateCache to clear it, on your app.run function add the following code:

$rootScope.$on('$viewContentLoaded', function() {
      $templateCache.removeAll();
});

Answer 2

Both Firefox devtools and Firebug have an ability to temporarily disable caching.

If you're using full-featured web server for development, you can disable cache from the server side, so you're not limited to debugger panel.