Очистить локальное хранилище не работает в Angular 7?

Question

Очистить локальное хранилище, когда не работает кнопка выхода из системы, также я не делаю это с файлами контроллера. Я использую только .ts и .HTML .Функция изготовления Есть ли способ сделать это без функции тоже?Любая особенность Angular?

Вот мой HTML-файл

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 19.315" width="20">
                    <g id="logout"  transform="translate(0
                       -1.66)" > </svg>

Вот мой ts файл

  public articlepara = { clientid: localStorage.getItem('storageselectedclient'), page: 1, type: 'All', keytype: '', sortdate: 'asc', sortpub: '', sortnews: '', fromdate: this.fromdate, todate: this.todate, publicationFilter: '', sortprominence: '' }
  user = {
    email: localStorage.getItem('email')
  }


  constructor(public article: ArticleService, http: HttpClient, elementRef: ElementRef, public _client: ClientService, private spinnerService: Ng4LoadingSpinnerService, private helper: HelperService, excelService: ExcelService, private filterPipe: FilterPipe) {
  }

  ngOnInit() {

    $("#reset").hide();
    var self = this;
    // $(document).ready(function(){
    $("#dateclick").click(function () {
      $('#rangeCal').toggle();
    })
    updateConfig();
    function updateConfig() {
      var options: { dateLimit: String } = {
        dateLimit: ""
        //,minDate: moment().subtract(365, 'days') , maxDate: moment() 
      };
      $('#config-demo').daterangepicker(options, function (start, end, label) {

        var startDateRange = end.format('YYYY-MM-DD');
        var endDateRange = start.format('YYYY-MM-DD');
        self.articlepara.todate = endDateRange;
        self.articlepara.fromdate = startDateRange;
        self.spinnerService.show();

        self.isActiveToday = false;
        self.isActive7Days = false;
        self.isActiveYesterday = false;
        self.isActivedaterange = true;
      });
    }
    //  });

    this.articlepara.type = 'ALL';
    this.articlepara.keytype = '';
    // this.articlepara.prominance = '';
    // this.articlepara.company = '';
    // this.articlepara.author = '';
    this.articlepara.publicationFilter = '';

    this.Clients();  //uncomment for client list
    this.selectedclient = localStorage.getItem('storageselectedclient');

    this.spinnerService.show();

  }
  Clients() {
    //console.log(this.user);
    // this.spinnerService.show();
    this._client.getClients(this.user)
      .subscribe(
        res => {
          // console.log(res);
          this.clientlist = res;
        },
        err => {
          console.log(err);
        },
        () => {
          // this.getallarticles();
          this.spinnerService.show();
          this.getUserDetails();
        }
      )
  }
  getUserDetails() {
    var postData = {
      clientid: localStorage.getItem('storageselectedclient'),
      email: localStorage.getItem('email')
    }

    this.article.getUserDetails(postData)
      .subscribe(
        res => {
          // console.log(res);
          this.userdetails = res[0];
        },
        err => {
          console.log(err);
        }
      )
    this.getUserClientDetails();
  }
  getUserClientDetails() {
    var postData = {
      clientid: localStorage.getItem('storageselectedclient')
    }

    this.article.getUserClientDetails(postData)
      .subscribe(
        res => {
          // console.log(res);
          this.userClientdetails = res[0];
          this.spinnerService.hide();
        },
        err => {
          console.log(err);
        }
      )
  }
  //=======================change selectd client form dropdownlist=============================//
  changeclient(value) {
    localStorage.setItem('storageselectedclient', value);
    localStorage.removeItem('storageselectedclient')
    this.spinnerService.show();
    this.getUserDetails();
  } 

Answer 1

Вы можете сделать функцию для удаления всех ключей

  removeAllLocalStorage() {
        localStorage.removeItem('key1');
        localStorage.removeItem('key2');
        localStorage.removeItem('key3');
        localStorage.removeItem('key4');
    }

Теперь вызовите эту функцию при выходе из системы, чтобы очистить ваше хранилище

Answer 2

Здесь нет относительного кода для того, что вы спрашиваете, но если вы хотите удалить что-то из локального хранилища, вы должны использовать localStorage.removeItem('keyOfYourItem');

Answer 3

до удалить элемент из локального хранилища

localStorage.removeItem("key_name");

до очистить локальное хранилище, т.е. очистить его (удалить все ключи, хранящиеся в локальном хранилище)

localStorage.clear();

Я думаю, что проблема в вашем коде

1. Вы не очищаете локальное хранилище или элемент, хранящийся в локальном хранилище где-либо
2. Даже если вы следуете 1-му пунктуВы должны вызвать свой конкретный метод из компонента по нажатию кнопки выхода из системы и очистить локальное хранилище в этом методе в компоненте

вот как вы это делаете

В HTML:

logout.component.html

<button id="logout" (click)="logoutUser()">Logout</button>

В компоненте:

logout.component.ts

//your rest component code

logoutUser(){

    //clear local storage
    localStorage.clear();

    //or
    //remove an key from local storage
    localStorage.removeItem("your_key);

    //things that you want to do for logout


}

Answer 4

localStorage.removeItem («введите свой ключ здесь»);