title: Angular : Destroy a service variable on logout
body: <p>I am working on an angular project in which I have a service(reports.service.ts) which is added as a provider in <code>app.module.ts</code>.</p>
  <p>Later this service was used in many components and these components modifies variables in that service when a user performs operations.</p>
  <p>Later I wanted to reset these service variables to null when the user logs out (and want to reflect this across the entire application/other components).</p>
  <p>This is what I did:</p>
  <pre><code>logout() {
      delete localStorage[AppConfig.USER_INFO_KEY];
      delete localStorage['CURRENT_BOT'];
      delete localStorage['DATE_OBJ'];
      this.Service.savedData = {};
      this.Service.dateObj = {};
      this.Service.token = '';
      this.Service.deleteMsg = '';
      this.router.navigate(['/login']);
  }
  </code></pre>
  <p>The problem is when I reset these variables like the way I did, this only resets variable inside the module in which this <code>logout()</code> function resides.</p>
  <p>P.S. I didn't provide the <code>reports.service.ts</code> in other components individually, just added it in <code>app.module.ts</code>.</p>