将 JSON 转换为打字稿中所需的格式

Question

我对 Angualr 6 和类型脚本还很陌生。从后端 API 调用我正在获取以下格式的数据。

> res = [{
>     "metadata": {
>         "lastGpSyncTime": "2000-11-21T16:07:53",
>         "dataFromDB": true
>     },
>     "noGoalSelectionReport": {
>         "userCount": 0
>     },
>     "oneGoalSelectionReport": {
>         "userCount": 237
>     },
>     "twoGoalSelectionReport": {
>         "userCount": 176
>     },
>     "threeGoalSelectionReport": {
>         "userCount": 17
>     },
>     "registeredCount": 547 }];

我需要将它转换成这样的格式，以便我可以在条形图中显示它。条形图需要以下格式。

[{
  "goalName": "No Goal",
  "userCount": 0
}, {
  "goalName": "One Goal",
  "userCount": 237
}, {
  "goalName": "Two Goals",
  "userCount": 176
}, {
  "goalName": "Three Goals",
  "userCount": 17
}];

我如何使用类型脚本来做到这一点。

Answer 1

那呢？

    formatData(res): { goalName: string, userCount: number }[] {

        const data = res[0];
        const groupNames = Object.keys(data);

        const formattedData = [];

        groupNames.forEach(groupName => {
            if (groupName !== 'metadata') {

                // Add Space before capital letter and remove SelectionReport
                let goalName = groupName.replace('SelectionReport', '').replace(/([A-Z])/g, ' ').trim();

                // Capitalize first letter
                goalName = goalName.charAt(0).toUpperCase() + goalName.slice(1);

                const dataGroupFormatted = {
                    goalName,
                    userCount: data[groupName].userCount
                };

                formattedData.push(dataGroupFormatted);
            }
        });

        return formattedData;

    }

Typescript 的强大之处在于定义类型，例如，您的条形图需要一个特定类型，该类型是包含 goalName 和 userCount 的对象数组。您可以通过添加更多类型（例如 res 的输入类型）来改进我的答案。

Answer 2

一个简单的考试

    var result = Object.keys(this.res[0]);
    let temp = [];
    for (let i = 0; i < result.length; i++) {
      if (result[i] !== "metadata" && result[i] !== "registeredCount") {
        
        temp.push({
          userCount: this.res[0][result[i]].userCount,
          goalName:
            result[i]
              .toUpperCase()
              .charAt(0) +
            result[i]
              .replace("SelectionReport", "")
              .replace(/([A-Z])/g, " ")
              .trim()
              .slice(1)
        });
      }
    }
    console.log(temp);

将 JSON 转换为打字稿中所需的格式

Convert a JSON to a required format in type script

typescript

angular

angular5

angular6