Angular：将字符串数组映射到http get调用中的枚举值数组

Posted 2023-03-13

【中文标题】Angular：将字符串数组映射到http get调用中的枚举值数组

【英文标题】：Angular: map string array to array of enum values in http get call

【发布时间】：2018-05-26 08:40:12

【问题描述】：

我的打字稿代码中有一个枚举，它列出了所有可能的用户角色：

enum UserRole 
    CONSULTANT,
    MANAGER,
    ...

我有一个 REST 端点 /users/id/roles，它返回代表特定用户角色的字符串数组：

[
    "CONSULTANT",
    "MANAGER",
    ...
]

现在我想在我的前端代码中映射这个数组。我是这样绑的：

import Http from '@angular/http';
import Observable from "rxjs/Observable";
import plainToClass from "class-transformer";
...

getUserRoles(id: string): Observable<UserRole[]> 
    return this.http.get(`/users/$id/roles`)
        .map(responce => plainToClass(UserRole, responce.json()));

但我明白了：

错误 TS2345：“typeof UserRole”类型的参数不可分配给“ClassType”类型的参数。 类型 'typeof UserRole' 与签名 'new (...args: any[]): UserRole[]' 不匹配。

问：有没有办法将字符串数组转换为枚举元素数组？

注意：我使用的是 Typescript 2.5.3。与 Angular 5.0.5 配对。

【参考方案1】：

您可以在从服务器返回的数组上使用map，一旦您使用json 将其转换为对象，如下所示：

return this.http.get(`/users/$id/roles`)
    .map(response => response.json().map(x => UserRole[x]));

如果遇到 Typescript 错误，您可能需要先转换 json 结果，如下所示：

return this.http.get(`/users/$id/roles`)
    .map(response => (<string[]>response.json()).map(x => UserRole[x]));