angular - 在带有角度5和打字稿的选择框中显示枚举类型？

Question

我有一个 Angular 5 应用程序。我已经声明了一个名为 DateRange 的枚举常量。

export enum DateRange {
  TODAY = 'Today',
  THIS_WEEK = 'This Week',
  THIS_MONTH = 'This Month',
  THIS_YEAR = 'This Year'
}

我想在我的组件 html 的选择框中显示这个枚举。知道如何实现吗？

我希望它如下

<select> 
  <option value="TODAY"> Today </option>
  <option value="THIS_WEEK"> This Week</option>
  <option value="THIS_MONTH">This Month </option>
  <option value="THIS_YEAR"> This Year </option>
</select>

标签： angulartypescript

Answer 1

在您的 html 中定义以下内容：

<select> 
   <option *ngFor="let range of Object.keys(ranges)" [ngValue]="range">{{ranges[range]}}</option>
</select>

在您的组件中定义以下内容：

ranges= DateRange;