清除本地存储在 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;

      });

    }

Answer 1

以下降从localStorage的使用项目localStorage.removeItem("key_name");要明确本地存储即清空（删除存储在本地存储的所有键）localStorage.clear();我认为您的代码中的问题是您没有在任何地方清除本地存储或存储在本地存储中的项目即使您遵循第一点，您也必须在单击注销按钮时从组件调用您的特定方法，并在组件中清除该方法中的本地存储这是你如何做到的在 HTML 中：登出.component.html<button id="logout" (click)="logoutUser()">Logout</button>在组件中：logout.component.ts//your rest component codelogoutUser(){&nbsp; &nbsp; //clear local storage&nbsp; &nbsp; localStorage.clear();&nbsp; &nbsp; //or&nbsp; &nbsp; //remove an key from local storage&nbsp; &nbsp; localStorage.removeItem("your_key);&nbsp; &nbsp; //things that you want to do for logout}

Answer 2

localStorage.removeItem('把你的钥匙放在这里');

Answer 3

您可以制作一个删除所有键的功能&nbsp; removeAllLocalStorage() {&nbsp; &nbsp; &nbsp; &nbsp; localStorage.removeItem('key1');&nbsp; &nbsp; &nbsp; &nbsp; localStorage.removeItem('key2');&nbsp; &nbsp; &nbsp; &nbsp; localStorage.removeItem('key3');&nbsp; &nbsp; &nbsp; &nbsp; localStorage.removeItem('key4');&nbsp; &nbsp; }现在在注销时调用此函数以清除您的存储