Question

我有以下格式的服务器响应：

"BudgetDays": [
        {
            "Id": 1,
            "Date": "2019-01-08T00:00:00",
            "Earned": 10,
            "Spent": 8,
            "Logged": false,
            "LoggedTime": "2019-02-10T12:36:09.377"
        },
        {
            "Id": 2,
            "Date": "2019-01-09T00:00:00",
            "Earned": 23,
            "Spent": 30,
            "Logged": false,
            "LoggedTime": "2019-02-10T12:36:09.38"
        }, ...

Typescript类为小写/驼峰字母，我如何将json映射到驼峰字母呢？

该函数返回BudgetDate[]，因此我需要以某种方式将其映射到该地址：

return this.http.get<Budget>(this.apiRoot + '/api/budgetdays', { params: params })
  .pipe(
    map(budgetDatesList.BudgetDates => sameObjectWithCamelCase),
    catchError((error: any) => Observable.throw(error))
  );

如何将对象映射为具有小写字母的属性。

Answer 1

该解决方案的RxJS方面很简单-只需使用已经确定的map运算符即可。

棘手的部分是转换接收到的响应数据对象中的所有属性键。

假设响应数据对象中的所有键都为标题大小写（即pascal大小写），则每个键所需要做的就是将第一个字符转换为小写。

下面，我提供了可以执行此映射的粗函数（mapPropNames）。请注意，它是递归工作的，因此它将转换所有嵌套对象的属性名称。

const { of } = rxjs;
const { map } = rxjs.operators;

const data = {
  "BudgetDays": [
    {
      "Id": 1,
      "Date": "2019-01-08T00:00:00",
      "Earned": 10,
      "Spent": 8,
      "Logged": false,
      "LoggedTime": "2019-02-10T12:36:09.377"
    },
    {
      "Id": 2,
      "Date": "2019-01-09T00:00:00",
      "Earned": 23,
      "Spent": 30,
      "Logged": false,
      "LoggedTime": "2019-02-10T12:36:09.38"
    },
 ],
};

function mapPropNames(o) {
  if (typeof o !== 'object' || o === null) {
    return o;
  }
  return Object.keys(o).reduce((a, key) => {
    // Customise the transformation of each property key if necessary
    const mappedKey = `${key[0].toLowerCase()}${key.slice(1)}`;
    a[mappedKey] = mapPropNames(o[key]);
    return a;
  }, o instanceof Array ? [] : {});
}

const request = of(data).pipe(
  map(mapPropNames),
);

request.subscribe(console.log);

<script src="https://cdnjs.cloudflare.com/ajax/libs/rxjs/6.4.0/rxjs.umd.min.js"></script>

将服务器对象映射到另一个对象

1 个答案: