如何在Angular 8模板中使用枚举?

组成部分ts

import { Component } from '@angular/core';
import { SomeEnum } from './global';

@Component({
  selector: 'my-app',
  templateUrl: './app.组成部分html',
  styleUrls: [ './app.component.css' ]
})
export class AppComponent  {
  name = SomeEnum.someValue;
}

组成部分html

<span *ngIf="name === SomeEnum.someValue">This has some value</value>

这目前不起作用,因为模板没有对SomeEnum的引用.我该怎么解决呢?

ERROR Error: Cannot read property 'someValue' of undefined

推荐答案

在TS中

import { SomeEnum } from 'path-to-file';

public get SomeEnum() {
  return SomeEnum; 
}

在HTML中的使用

*ngIf="SomeEnum.someValue === 'abc'"

编辑:

在TS中

import { SomeEnum } from 'path-to-file';

export class ClassName {
  readonly SomeEnum = SomeEnum;
}

在HTML中的使用

*ngIf="SomeEnum.someValue === 'abc'"

Typescript相关问答推荐

如何获取数组所有可能的索引作为数字联合类型?

为什么缩小封闭内部不适用于属性对象,但适用于声明的变量?

动态判断TypScript对象是否具有不带自定义类型保护的键

类型{...}的TypeScript参数不能赋给类型为never的参数''

具有动态键的泛型类型

更新为Angular 17后的可选链运算符&?&问题

带switch 的函数的返回类型的类型缩小

用于验证字符串变量的接口成员

在类型脚本中创建泛型类型以动态追加属性后缀

推断从其他类型派生的类型

常量类型参数回退类型

如何将通用接口的键正确设置为接口的键

如何正确地将元组表格输入到对象数组实用函数(如ZIP)中,避免在TypeScrip 5.2.2中合并所有值

如何创建一个将嵌套类属性的点表示法生成为字符串文字的类型?

导航链接不触发自定义挂钩

如何填写Partial的一些属性并让类型系统知道它?

如何为对象数组中的每个条目推断不同的泛型

有没有一种简单的方法可以访问Keyboard Shortcuts JSON文件中列出的每个命令的显示名称(标题)?

如何从联合类型推断函数参数?

根据索引将元组拆分为两个块