Question

我喜欢将json字符串值转换为枚举，以便它可以在html页面上显示/呈现自定义字符串。错误消息：键入'{id：number;名称：字符串；状态：字符串； } []'不能分配给'Status []'类型

我有一个这样的json记录：

{ id: 1, name: 'Some name', status: 'STATUS01' },

status.enum.ts

export enum Status {
  'STATUS01' = 'Operational',
  'STATUS02' = 'Some other status'
}

该枚举用于模型中

import { Status } from './status.enum';

export class ServiceState {
  id: number;
  name: string;
  status: Status;
}

该服务中有一个用于检索所有状态（虚拟数据）的功能：

getStatuses(): Observable<ServiceState[]> {
    const response = [
      { id: 1, name: 'One', status: 'STATUS01' },
      { id: 2, name: 'Two', status: 'STATUS01' },
      { id: 3, name: 'OneTwo', status: 'STATUS02' },}
    ];
    return of(response);
  }

退货引发错误

Answer 1

您实际上应该使用枚举值：

export enum Status {
  STATUS01 = 'Operational',
  STATUS02 = 'Some other status'
}

const response = [
  { id: 1, name: 'One', status: Status.STATUS01 },
  { id: 2, name: 'Two', status: Status.STATUS01 },
  { id: 3, name: 'OneTwo', status: Status.STATUS02 },
  // ...
];

如果要映射枚举中的值：

getStatuses(): Observable<ServiceState[]> {
  const response = [
    { id: 1, name: 'One', status: 'STATUS01' },
    { id: 2, name: 'Two', status: 'STATUS01' },
    { id: 3, name: 'OneTwo', status: 'STATUS02' },
  ];

  return of(response).pipe(
    map((states) => states.map((state) => ({
      ...state,
      status: Status[state.status]
    } as ServiceState)
  );
}

Answer 2

我仍然不明白您的问题，但是您可能必须映射API的响应以匹配您的类类型。

服务

public getStatuses(): Observable<ServiceState[]> {
  return this.http.get('url').pipe(
    map(data => data.forEach(item => {
      item.status = Status[item.status];
    }))
  );
}

^{如果仅使用类来声明类型，则只需一个简单的接口即可。}

将json值转换为枚举值

2 个答案: