Remove Template cache on logout Angular.js

Question

How to remove Angular template cache once user clicks on logout? We did thorough research and tried to implement most of the solutions available out there. we tried following

HTML Meta Tags

<meta http-equiv="Cache-Control" content="no-cache" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Expires" content="0" />

Server side

res.setHeader('cache-control', 'no-cache', 'no-store', 'must-revalidate');

Javascript

We tried to delete browser history as specified on this blog

Problem we are facing right now is when a user logs out from our app and press back button he is shown empty html templates as services are not cached how shall we make sure templates are not cached either?

Answer 1

$templateCache is just a wrapper around $cacheFactory with a specific name. This is literally all of its code:

function $TemplateCacheProvider() {
  this.$get = ['$cacheFactory', function($cacheFactory) {
    return $cacheFactory('templates');
  }];
}

$cacheFactory has a removeAll() method. Try this, if you want to wire it up yourself (e.g. in a service into which you've injected $cacheFactory):

$cacheFactory('templates').removeAll();

But separately, maybe you want to disable caching entirely if your application is security-sensitive. You can do a reload() call on the entire browser to dump all local JS variables, and then your no-cache pragmas above on the actual HTTP-driven assets will do what you want.