时间戳

首页 > 解决方案 > 在打字稿中手动设置值对象的属性

typescript - 在打字稿中手动设置值对象的属性

问题描述

如果服务调用中不存在值对象的数据，我正在尝试手动设置值对象的属性。

数据来自服务调用（它有效，因为我取回了数据）。服务调用中的对象如下所示：

export class AllHouseData {
    dataList: HouseResponse[];
    numberOfHouses: number;
}

HouseResponse 对象的值对象如下所示：

export class HouseResponse {
    id: number;
    name: string;
    settings: HouseSettings[];
}

HouseSettings 对象的值对象如下所示：

export class HouseSettings {
    id: number;
    houseCode: string
    parking: any;
}

这是我试图分配对象属性的代码：

export class HouseComponent implements OnInit {
    houseData: AllHouseData;

    callHouseService(houseList) {
        this.houseService.getHouseData(houseList).subscribe((data) => {
            this.houseData = data;
            if (data === null) {
                this.houseData.dataList = [
                    {
                        id: 0,
                        name: "",
                        settings: [{ id: number, houseCode: "", parking: false }],
                    },
                ];
            }
        });
    }
}

尝试手动设置数据时，Typescript 没有给我任何错误。但是，在浏览器的控制台中，我收到以下错误：ERROR TypeError: Cannot set properties of null (setting 'dataList')。

我的问题是，手动设置此对象的正确方法是什么？

标签： typescriptangular9

解决方案

看起来您的 getHouseData 调用返回 null 并且您没有对此进行检查。

如果您需要 this.houseData 始终有一个值，我会推荐一个具有默认值的构造函数。

export class HouseSettings {
  constructor(public id = 0, houseCode = '', parking = false) {}
}
export class HouseResponse {
  constructor(public id = 0, name = '', public settings = [new HouseSettings()]) {}
}

export class AllHouseData {
  constructor(public dataList = [new HouseResponse()], public numberOfHouses = 0) {}
}

然后在您的订阅中，您可以简单地使用：

data => this.houseData = data ?? new AllHouseData()

推荐阅读