18

This is what i currently want to do in my component. I want to delete or destroy my localStorage content whenever i route to a different component. I want to achieve this so as to avoid the localStorage variable from storing previous values even tho new values are coming in. Am i on the right path?

Game Component

export class Game implements OnDestroy{

 constructor(){

 this.currentGame = JSON.parse(localStorage.getItem('currentGame'));

}

ngOnDestroy(){

  this.currentGame = null;

}


}
Mistalis
  • 17,145
  • 13
  • 72
  • 95
XamarinDevil
  • 793
  • 4
  • 15
  • 36
  • 1
    Possible duplicate of [Removing items from LocalStorage with AngularJS](http://stackoverflow.com/questions/26323961/removing-items-from-localstorage-with-angularjs) – Liam Apr 26 '17 at 14:40
  • 2
    Possible duplicate of [remove value from localstorage javascript](http://stackoverflow.com/questions/14864256/remove-value-from-localstorage-javascript) – Heretic Monkey Apr 26 '17 at 14:46

1 Answers1

91

you can use

localStorage.removeItem('currentGame');

Alternatively, you can also clear the whole localStorage with

localStorage.clear();
Deblaton Jean-Philippe
  • 10,809
  • 2
  • 49
  • 65
  • @sam But when I typed another route url in browser , then current component's ngOnDestroy not executed. Which is resulting the same data is coming for another component as well. Which is irrelevant data. – Abhi Jun 14 '19 at 12:13
  • @Abhi Why not clear the `localStorage` and then route to another url? Makes the job easier! – sam Jun 14 '19 at 13:14
  • @sam how to do that? and can you pls have a look at my reply below as well. Thanks.. – Abhi Jun 14 '19 at 13:59
  • You can clear the localStorage prior to routing itself, why bother onDestroy! – sam Jun 14 '19 at 14:08
  • @sam After applying filter , if user refreshes the page , still the filter params should be persist and should apply. But, in your case those will be removed? How to implement this. – Abhi Jun 14 '19 at 14:22
  • @sam, can you pls check once – Abhi Jun 14 '19 at 18:26
  • @Abhi You only need to remove an item, right? If means use `removeItem` and not `clear` from localStorage. – sam Jun 15 '19 at 05:02
  • @sam My issue , I clearly explained here.. Can you pls have a look https://stackoverflow.com/questions/56605192/clear-localstorage-when-navigating-to-another-route-through-url – Abhi Jun 15 '19 at 06:26
  • Let us [continue this discussion in chat](https://chat.stackoverflow.com/rooms/194979/discussion-between-abhi-and-sam). – Abhi Jun 15 '19 at 08:15
  • Can we write localStorage.getItem and localStorage.removeItem in same page? Because I have written it. But I'm removing localStorage on click of a button but the item is getting removed without clicking the button. May be on page load it is getting removed. – Kalyan Aug 27 '20 at 14:13
  • @Kalyan it looks like your code is executed on page load. Maybe put `alert("I'm beeing executed");` just before removing the item to find out ;-) – Deblaton Jean-Philippe Aug 31 '20 at 06:27
  • @DeblatonJean-Philippe Yes my code is executing on page load... how to handle this? – Kalyan Sep 01 '20 at 04:43
  • @Kalyan You might have had a wrong ```type``` of your ```button``` or even no type at all. Try using ```type="button"``` – MikhailRatner May 10 '22 at 13:17