首页 > 解决方案 > 根据 http 响应值 angular 动态显示字体真棒图标

问题描述

团队,

根据我的 api 值,我需要向材料字段显示一个锁定图标。

这是我的 api 输出,其中有一个属性调用锁:如果为真,则为字段应该有一个锁图标

目前 Iam 以静态方式显示所有字段。

在此处输入图像描述

这是我的 api,其中有一个属性调用 Locked 当前值是 true 基于值锁定图标应该来这里是我当前的代码

HTML 代码

        <mat-form-field appearance="fill">
        <mat-label>List Items</mat-label>
        <select matNativeControl required formControlName="title">
            <option value="Mr">Mr.
            </option>
            <option value="Mrs">Mrs.
            </option>
            <option value="Ms">Ms.
            </option>
            <option value="Miss">Miss.
            </option>
        </select>
        <span *ngif="isLocked" class="fa fa-lock lock_field"></span>
    </mat-form-field>

我试图在我的 ts 中使用 Ngif 我创建了布尔调用isLocked最初我将其设置为 false。我想在页面加载时放入 ngoninit 我试图将我的条件合并到下面的代码中

这是我的 ts 代码

  getFieldData() {
const data = {
  module: this.data.entityName,
  entity: this.data.entityFormName
};

if (data.module && data.entity) {
  // if (!((data.module === undefined || null) && (data.entity === undefined || null))) {
  this.settingService.getFormData(this.fields, data.module, data.entity).subscribe((response) => {
    this.fieldData = response;       
    
  })
}    

}

这是api代码

  getFormData(data: any, module, entity): Observable<FormData[]> {
    const formData = "/fields/getModulesEntity?module=" + module + '&entity=' + entity;
    return this.http.get<FormData[]>(formData);
  }

这是我的 api 输出。

在此处输入图像描述

标签: angulartypescriptangular8

解决方案


推荐阅读