Angular 8：如何从 json REST API 创建枚举答案

【问题标题】：Angular 8: How to create enum from json REST APIAngular 8：如何从 json REST API 创建枚举
【发布时间】：2020-09-04 09:21:43
【问题描述】：

如何从 json rest api 创建枚举？

我有这个 service.ts

getDataFromJson(): Observable<any> {
    return this.httpClient.get<any>(`../../../assets/gender.json`)
      .pipe(map(data => {
        return data;
    }));
  }

但它返回为

[
  {
    "name": "Female",
  },
  {
    "name": "Male",
  }
]

使用此代码

getGenders: any = {}

getGender() {
    this.options.getDataFromJson().subscribe(data => {
      this.getGenders = data;
    })
  }

而不是这种格式

{
    Male = 'Male',
    Female = 'Female',
}

我希望它返回为 enum 类型并将其放在我的 gender.ts 中，就像这样。

export enum Gender {
    Male = 'Male',
    Female = 'Female',
}

感谢您的帮助。

【问题讨论】：

看看this的回答。
这应该很有用：stackoverflow.com/questions/54058699/…

标签： javascript angular typescript enums

【解决方案1】：

我认为 enum 在这里不是正确的词。请考虑一个常数。

假设您有一个 gender.json 文件，该文件在您的项目中包含以下内容。

[
  {
    "name": "Female"
  },
  {
    "name": "Male"
  }
]

现在你想在 gender.ts 中创建另一个变量，它包含预期的格式。

export const genders = {
    Male: 'Male',
    Female: 'Female',
};

要动态构建此性别常量，您需要做两件事。

第一个：转到您的 compilerOptions 并包含这两行：

"resolveJsonModule": true,
"allowSyntheticImports": true

第二：回到gender.ts并导入json文件。然后将 json 的内容转换为预期的格式。

import genderJson from './gender.json';

export const genders = genderJson
  .map(gender => gender.name).reduce((acc, gender) => {
    acc[gender] = gender;
    return acc;
  }, {});

查看工作中的 stackblitz：https://stackblitz.com/edit/angular-ivy-uocg2j?file=src%2Fapp%2Fgender.ts

【讨论】：