时间戳

首页 > 解决方案 > 删除空行

angular - 删除空行

问题描述

我有这个清单：

export enum UserRoleType {
  masterAdmin = 'ROLE_MASTER_ADMIN'
  merchantAdmin = 'ROLE_MERCHANT_ADMIN'
  resellerAdmin = 'ROLE_RESELLER_ADMIN'
}

export const AdminRoleType2LabelMapping = {
  [UserRoleType.masterAdmin]: 'Master Admin'
};

export const MerchantRoleType2LabelMapping = {
  [UserRoleType.merchantAdmin]: 'Merchant Admin'
};

export const ResellerRoleType2LabelMapping = {
  [UserRoleType.resellerAdmin]: 'Reseller Admin'

};


public ResellerRoleType2LabelMapping = ResellerRoleType2LabelMapping;
  public roleTypes = Object.values(UserRoleType).filter(value => typeof value === 'string');

落下：

<select class="custom-select" formControlName="role">
        <option [value]="roleType" *ngFor="let roleType of roleTypes">{{ ResellerRoleType2LabelMapping[roleType] }}</option>
        <div class="help-block form-text with-errors form-control-feedback" *ngIf="controlHasErrors('role')">
          {{controlValidateMessage('role')}}
        </div>
      </select>

我想删除空行。我试图只使用这样的键：

public roleTypes = Object.keys(UserRoleType).filter(value => typeof value === 'string');

但我得到的只有空白行。

我想根据页面的类型显示不同的 const 。但是由于某种原因，我得到了带有几个空白行和所需列表的选择菜单。你知道我该如何解决这个问题吗？我不想显示空行。

标签： angulartypescriptangular7angular8

解决方案

原因

ResellerRoleType2LabelMapping仅包含UserRoleType.resellerAdmin但roleTypes具有所有角色。ResellerRoleType2LabelMapping[UserRoleType.masterAdmin]因此，例如，当您询问时，您将获得“未定义”的值。

 解决方案

使用 uniq“labelMapping”。

打字稿

代替

public ResellerRoleType2LabelMapping = ResellerRoleType2LabelMa

经过

public labelMapping = {...AdminRoleType2LabelMapping, ...MerchantRoleType2LabelMapping, ...ResellerRoleType2LabelMapping};

HTML

并更换

{{ ResellerRoleType2LabelMapping[roleType] }}

经过

{{ labelMapping[roleType] }}

推荐阅读