代码之家 › 专栏 › 技术社区 › Szyszka947

TypeScript中C#中[JsonPropertyName]的等价项

json-deserialization typescript angular json

0

Szyszka947 · 技术社区 · 3 年前

我需要对Angular中定义的类的一些JSON响应进行反序列化。让我们举一个例子:

export class ChatHubInfo {
  hubUrl: string = undefined!
  accessToken: string = undefined!
}

但是JSON响应看起来像:

{
   "hub_url": "https://localhost:8080/",
   "access_token": "v4.public.eY..."
}

所以在反序列化时,我想映射 hub_url 到 hubUrl 等等。在C#中使用 [JsonPropertyName] 属性,但我在Angular中找不到等效属性。

或者,也许可以使用“hub_url_”等属性名称?

1 回复 | 直到 3 年前

1

Jonas 3 年前

您可以查看响应,将下划线后的所有字符替换为大写版本,并动态删除下划线,基本上是一个蛇到骆驼的大小写函数:

function snakeToCamel(str: string): string {
    return str.replace(/_([a-z])/g, (_, group1) => group1.toUpperCase());
}

function convertKeysToCamelCase(obj: Record<string, any>): Record<string, any> {
    const result: Record<string, any> = {};

    for (const key in obj) {
        if (Object.prototype.hasOwnProperty.call(obj, key)) {
            const camelKey = snakeToCamel(key);
            result[camelKey] = obj[key];
        }
    }

    return result;
}

您也可以使用“类转换器”模块(建议使用):

npm i class-transformer

然后这样调整您的代码:

import { Expose } from "class-transformer"
export class ChatHubInfo {
    @Expose({name: "hub_url"})
    hubUrl: string = undefined!
    
    /*...etc...*/
}

然后使用类转换器模块提供的plainToClass函数生成带有JSON响应的Object:

import { plainToClass } from "class-transformer"
const chatHubInfo = plainToClass(ChatHubInfo, {
    "hub_url": "https://localhost:8080/",
    "access_token": "v4.public.eY..."
});