Question

如何在ng if中使用本地存储变量。

我已经实现了，但向我显示错误，因为无法读取未定义的属性'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>

预先感谢

Answer 1

首先您的ngIf语法完全错误，其次您可以从localStorage检索值并将其绑定

更改

<ng-template  *ngIf="objUserData.role===''">

Answer 2

您可以尝试使用此解决方案。

component.html

<ng-template *ngIf="getRole(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>

component.ts

getRole(role){
   return localStorage.getItem(role) || ''
}

Answer 3

您的错误清楚地说明了SVG，因为Cannot read property 'getItem' of undefined没有getItem（）原型。因此，您可以通过以下方式解决此问题

您应将本地存储分配给需要在HTML中使用的变量
或使用全局方法通过传递localStorage来读取本地存储值。（这是最好的方法，因为全局读取数据，我在下面说明了）

组成方法：

keys

您的HTML端应如下所示

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

注意：我不确定您的代码中使用的*ngIf="readLocalStorageValue('Role')== ''"对象。我希望这是localStorage的关键。但如果它具有任何动态值，则在{Local_ValueValue方法中使用Role对象而不使用单引号

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

3 个答案: