将所有枚举值映射到 TypeScript 中的接口数组

rea*_*ist 0 enums typescript angular

我想将所有枚举值映射到 SelectItem 数组接口。

选择项.ts

 export interface SelectItem {
        label?: string;
        value: any;
    }
Run Code Online (Sandbox Code Playgroud)

性别.ts

export enum Gender{
  Description("MaleDescriptionExample")  //?????????
  Male = 1,
  Description("FemaleDescriptionExample")//?????????
  Female = 2
}
Run Code Online (Sandbox Code Playgroud)

我想要下面的例子。我写得像 C#。但我想要打字稿。我怎样才能做到这一点?

  var myList= selectItem[] ;
  this.myList=Gender.map(p=>  //?????????
    label= p.Description,
    value= (int)(p.value)
  );
Run Code Online (Sandbox Code Playgroud)

Tit*_*mir 5

您不能像向 C# 枚举添加属性那样向枚举添加装饰器。然而,我们可以创建一个与枚举具有相同键的类型,这将强制我们指定枚举的所有键及其字符串描述。

有了那个对象,我们只需要获取枚举的键,并在枚举中查找值和额外对象中的描述。

export enum Gender {
  Male = 1,
  Female = 2
}

// We will geta an error if we have missing/ extra or misspelled keys
let descriptions: { [P in keyof typeof Gender]: string } = {
  Female: "FemaleDescriptionExample",
  Male: "MaleDescriptionExample"
}
export interface SelectItem {
  label?: string;
  value: any;
}
var myList: SelectItem[] = (Object.keys(Gender) as Array<keyof typeof Gender>)
  .filter(p => typeof Gender[p] === "number") // The enum contains both the lookup and the reverse lookup, we only need name->value so we take only the number keys
  .map(p => ({
    label: descriptions[p],
    value: Gender[p]
  }));

console.log(myList);
Run Code Online (Sandbox Code Playgroud)