Angular2-如何在* ngIf中使用字符串枚举

Question

在Angular中enum使用时如何传递给函数*ngIf？

我有以下代码：

export enum RoleType {
    User='User',
    Admin='Admin'
}

组件功能

public hasAccess(role: RoleType) {
   //check role type and return true or false
}

组件html

<div id="adminDiv" *ngIf="hasAccess('Admin')">
</div>

当我构建它时，它一直在抱怨。它不能将字符串转换为枚举，是否有办法解决？

Answer 1

这是一种更简洁的方法。在您的 component.ts 中执行以下操作

allRoleTypes = RoleType;

并在您的 html 中

*ngIf="role===allRoleTypes.User"

您不需要编写任何方法。

Answer 2

正如@Buczkowski建议的那样，您可以这样做：

export enum RoleType {
    User = 'User',
    Admin = 'Admin'
}

零件

RoleType = RoleType; // This way you can access its properties from the template.

public hasAccess(role: RoleType) {
    //check role type and return true or false
}

组件html

<div id="adminDiv" *ngIf="hasAccess(RoleType.Admin)">
</div>

StackBlitz示例

Answer 3

将其作为字符串获取，然后将其转换为 RoleType。

public hasAccess(role: string): boolean {
const roleAsEnum: RoleType = RoleType[role];

return ...
}