JSON轉換為Angular中的TypeScript

Question

我在angular中有一個http服務，該服務可以調用Web api以獲取需要反序列化為Typescript（.ts）對象的JSON數據。 JSON中的鍵名（即“屬性”）與打字稿中的鍵名（即“屬性”）不匹配-表示JSON數據為大寫，打字稿為小寫。 是否有一個帶有http調用的映射函數，可以在其中將json反序列化為打字稿？

從Web API返回的示例JSON

"Packages": [
      {
          "IsESignAllowed": false,
          "IsEnabled": true,
          "Name": "Brokerage Accounts Package",
          "PackageId": 2
      }
]

Angular上的相關.ts文件

export class Package {
    public isESignAllowed: boolean;
    public isEnabled: boolean;
    public name: string;
    public packageId: number;
}

Answer 1

您可以在Typescript中向Package類添加一些序列化函數，這將使您可以將JSON對象從服務器映射到TS中的新Package對象。

如前所述，最好在任何地方都保留標准的駝峰式約定-並讓服務器發送帶有小寫字母屬性名稱的JSON，但是，如果不可能，仍可以在序列化函數中處理。

export class Package {
    public isESignAllowed: boolean;
    public isEnabled: boolean;
    public name: string;
    public packageId: number;

    static fromJson(jsonObj: any) {
        const newPackage = new this();
        newPackage.isESignAllowed = jsonObj.IsESignAllowed;
        newPackage.isEnabled = jsonObj.IsEnabled;
        newPackage.name = jsonObj.Name;
        newPackage.packageId = jsonObj.PackageId;
        return newPackage;
    }

    public toJson(): any {
        const jsonObj: any = {};
        jsonObj.IsESignAllowed = this.isESignAllowed;
        jsonObj.IsEnabled = this.isEnabled;
        jsonObj.Name = this.name;
        jsonObj.PackageId = this.packageId;
        return jsonObj;
    }
}

從服務器接收到JSON之后，現在就可以將包數組映射到新的Package.fromJson（）函數上，以創建Package對象列表。

const packages = serverResponse.Packages.map(packageJson => Package.fromJson(packageJson));