无法在 HTML 中接近 Typescript 枚举

模板的范围仅限于组件实例成员。如果你想引用它需要在那里可用的东西

class MyComponent {
  public get connectionResult(): typeof ConnectionResult {
    return ConnectionResult; 
  }
}

在 HTML 中，您现在可以使用

*ngIf="connectionResult.Success"

另请参阅Angular2 access global variables from HTML template

---

您必须按以下方式将其写入 .ts 文件。

enum Tenure { day, week, all }

export class AppComponent {
    tenure = Tenure.day
    TenureType = Tenure
}

现在在 html 中你可以像这样使用它

*ngIf = "tenure == TenureType.day ? selectedStyle : unSelectedStyle"

我希望现在更清楚了。 :)

---

您可以将枚举作为属性添加到组件中，并在模板中使用与枚举（Quarters）相同的名称：

enum Quarters{ Q1, Q2, Q3, Q4}

export class AppComponent {
   quarter = Quarters.Q1
   Quarters = Quarters //here you are creating a variable/alias to the enum
}

在您的模板中

<div *ngIf="quarter == Quarters.Q1">I=am only visible for Q1</div> 

之所以可行，是因为新的属性基本上是这种类型：

TileType: typeof TileType

---

import MyEnum from enums;  

.... 声明 var ....

public myEnum = MyEnum;

并在 html 中使用：

<div *ngIf="xxx === myEnum.DATA"> ... </div>

---

如果枚举定义如下，您可以绑定为文本（这些值不会强制来自 API 的 json 字符串值）

  export enum SomeEnum {
      Failure = "Failure",
      Success = "Success",
  }

在 .ts 文件中

public status: SomeEnum;

在 .html 中

<div *ngIf="status == 'Success'">

在 Angular 8+ 中测试的另一种方法是使用带有数字的枚举

  export enum SomeEnum {
      Failure = 0,
      Success = 1,
  }

在 .ts 文件中

public status: SomeEnum;

在 .html 中

<div *ngIf="status == 1">

---

在您的服务中

export enum ConnectionResult {
    Success,
    Failed     
}

将枚举分配给 TypeScript 文件中的变量

ConnectionResult = ConnectionResult; 

然后从 HTML 中读取您的枚举，如下所示

*ngIf="result == ConnectionResult.Success"

---