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

Question

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

数据来自服务调用（它有效，因为我取回了数据）。从服务调用来看，对象看起来像这样：

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').

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

Answer 1

您的 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()

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

Manually set value object's properties in typescript

typescript

angular9