在从 HttpClient 请求获得的 object 转换新类型之前,如何使用 rxjs 映射来改变 object 中的数据?

How do I use rxjs map to mutate data in object before casting a new type from an object gotten from a HttpClient request?

希望标题不要太具体。

back-end 我正在使用 returns 日期作为字符串。我有一个函数可以将该字符串转换为 javascript 日期 object。我使用 Rxjs 映射将 json 响应转换为我的 Typescript objects,就像这样。


  getAllRecordsByEmployeeId(employeeId: number): Observable<Record[]> {
    return this.http.get<Record[]>(
        this.basePath
        + this.recordPath
        + this.recordEmployeeIdParam
        + employeeId,
        this.httpOptions)
        .pipe(
            map((res: any) => res.records as Record[]),
        );
  }

我想在 res.records.startDate 变成记录 object 之前用一个函数改变它。我怎样才能做到这一点?

我们在我的申请中做了类似的事情。但不是返回

res.records as Record[]

我们这样做:

.pipe(
      map((records: Record[]) => records.map(records => new Record(record)))
);

然后在 record.ts

export class Record {
  /*
    properties
  */
  date: Date;

  constructor(params: Partial<Record> = {}) {
    this.date = new Date(params.date);
  }
}

通过这种方式,您实际上可以获得 class 的实例,并且您可以使用 class 中可能具有的任何功能(这就是我们提出此解决方案时遇到的问题)。

getAllRecordsByEmployeeId(employeeId: number): Observable<Record[]> {
    return this.http.get<Record[]>(

据我所知,您的 http 请求实际上 return 不是 Record 数组。它 return 是一个带有 Record 数组字段的对象,这基本上是另一个 Record 模型。很像,但是型号不同

请考虑将其更改为:

interface RecordFromApi extends Record {
  startDate: string; // overwrite attribute
}

interface RecordResponse {
  records: RecordFromApi[];
}

getAllRecordsByEmployeeId(employeeId: number): Observable<Record[]> {
    return this.http.get<RecordResponse>(
        this.basePath
        + this.recordPath
        + this.recordEmployeeIdParam
        + employeeId,
        this.httpOptions)
        .pipe(
            map((res: RecordResponse) => res.records.map(record => mapRecord(record))), // mapRecord is a custom function which maps RecordFromApi model to Record model
        );
  }