时间戳

首页 > 解决方案 > 如何在 ngif 中使用本地存储值

angular - 如何在 ngif 中使用本地存储值

问题描述

如果..我如何在 ng 中使用本地存储变量

我已经实现但显示错误为无法读取未定义的属性'getItem'..

这是我的代码：

<ng-template [ngIf]="localStorage.getItem(Role)==''">
    <td>
        <button class="btn btn-primary editable-table-button btn-xs" (click)="updatetq(tq_list.cmslearntopicid
      ,tq_list.cmslearnchapterid,tq_list.topicname);">Edit</button>
    </td>
    <td>
        <button class="btn btn-danger editable-table-button btn-xs" (click)="deletet(tq_list.cmslearntopicid);">Delete</button>
    </td>
</ng-template>

提前致谢

标签： angular

解决方案

你的错误说得很清楚Cannot read property 'getItem' of undefined，因为localStorage没有 getItem() 原型。因此，您可以通过以下方式解决此问题

  • 您应该将本地存储分配给需要在 HTML 中使用的变量
  • 或使用全局方法通过传递来读取本地存储值keys。（由于全局读取数据，这是最好的方法，我在下面解释）

组件方法： 

readLocalStorageValue(key)
    {
      let value =   localStorage.getItem(key);
      if(value == undefined)
        {
          value =='';
        }
       return value;
    }

你的 HTML 端应该如下所示

*ngIf="readLocalStorageValue('Role')== ''"

注意：我不确定Role您的代码中使用的对象。我希望它是localStorage的一个键。但如果它有任何动态值，则Role在 readLocalStorageValue 方法中不使用单引号传递对象

推荐阅读