如何从json字符串转换为json对象后从Typescript中的对象数组中获取结果，我的编码有什么问题

Question

请看我下面的代码。在从json字符串转换为json对象后，我正在从对象数组中提取数据。

export class FourColumnResults {

    constructor(private column1: string, private column2: string,
        private column3: string, private column4: string) {

    }

    public get $column1(): string {
        return this.column1;
    }

    public set $column1(value: string) {
        this.column1 = value;
    }


    /** all getter and setter methods */
}


export class ValidationSummary {

    constructor(private column1: string, private column2: string, private column3: string,
        private column4: string, private column5: string, private column6: string,
        private column7: string) {

    }

    public get $column1(): string {
        return this.column1;
    }

    public set $column1(value: string) {
        this.column1 = value;
    }

    /** all getter and setter methods */

}

从./FourColumnResult导入{ FourColumnResults }；从‘./ ValidationSummary’导入{ValidationSummary}；

export class MyConverter {

    public convert(jsonString: string): FourColumnResults[] {
        const results: FourColumnResults[] = [];
        const valSummary: ValidationSummary[] = JSON.parse(jsonString);
        console.log("ValSummary object======== ", valSummary); // This is printing correctly

        for(let i = 0; i < valSummary.length; i++) {
            const value: ValidationSummary = valSummary[i];
            console.log("=====>"+value.$column1);
        }

        return results;
    }

}

下面是我从系统中得到的实际json字符串。

[
  {
    "column1": "Data-1",
    "column2": "Data-2",
    "column3": "Data-3",
    "column4": "Data-4",
    "column5": "Data-5",
    "column6": "Data-6",
    "column7": "Data-7"
  },
  {
    "column1": "Data-11",
    "column2": "Data-12",
    "column3": "Data-13",
    "column4": "Data-14",
    "column5": "Data-15",
    "column6": "Data-16",
    "column7": "Data-17"
  },
  {
    "column1": "Data-31",
    "column2": "Data-32",
    "column3": "Data-33",
    "column4": "Data-34",
    "column5": "Data-35",
    "column6": "Data-36",
    "column7": "Data-37"
  }
]

这里的问题是，我可以用下面的代码将上面的json字符串解析成我的ValidationSummary.ts类型的json对象。

const valSummary: ValidationSummary[] = JSON.parse(jsonString);

但是，我无法从以下编码中获得结果。

for(let i = 0; i < valSummary.length; i++) {
            const value: ValidationSummary = valSummary[i];
            console.log("=====>"+value.$column1); // Prints Undefined
        }

我的代码出了什么问题？请帮我解决。

Answer 1

应该是value.column1而不是value.$column1

for(let i = 0; i < valSummary.length; i++) {
    const value: ValidationSummary = valSummary[i];
    console.log("=====>"+value.column1); // Prints the value
}

Answer 2

问题

由于您是从字符串进行解析，因此它将不具有原始的Class属性。使用冒号指定

const value: ValidationSummary

将只提供数据的类型。

应答

您必须为JSON.parse函数提供一个reviver函数，如下所示。

数据应该有一个密钥来恢复数据，所以，维护一个密钥，

const s = '{"data":[{"column1":"Data-1","column2":"Data-2","column3":"Data-3","column4":"Data-4","column5":"Data-5","column6":"Data-6","column7":"Data-7"},{"column1":"Data-11","column2":"Data-12","column3":"Data-13","column4":"Data-14","column5":"Data-15","column6":"Data-16","column7":"Data-17"},{"column1":"Data-31","column2":"Data-32","column3":"Data-33","column4":"Data-34","column5":"Data-35","column6":"Data-36","column7":"Data-37"}]}';

您的类应该有一个从json数据创建对象的from函数。

class ValidationSummary {

    constructor(private column1: string, private column2: string, private column3: string,
        private column4: string, private column5: string, private column6: string,
        private column7: string) {

    }

    static from(json: ValidationSummary) {
        return Object.assign(new ValidationSummary(), json);
    }

    public get $column1(): string {
        return this.column1;
    }

    public set $column1(value: string) {
        this.column1 = value;
    }

    /** all getter and setter methods */

}

最后，reviver函数将类功能映射到数据。

function reviveData(key: string, value: any) {
    if (key === 'data') {
        return value.map(ValidationSummary.from);
    }
    return value;
}

传递数据和复活器函数

data = JSON.parse(s, reviveData).data;
console.log(data[0].$column1);

输出

"Data-1"

​

​

代码：http://www.typescriptlang.org/play/?ssl=31&ssc=1&pln=32&pc=1#