Question

我正在尝试为对象的某些属性分配一些值。但是控制台记录了错误ERROR TypeError: Cannot set property 'requested_date' of null。我试图找出问题所在，但我认为这很好。

代码如下：

form = {
    data: null as IMediaStorageAdd,
    requester: null as string
}

IMediaStorageAdd是一个接口：

export interface IMediaStorageAdd {
    place: string;
    requested_date: any;
    temp_requested_date: any;
    details: any[];
}

这是我运行分配对象的地方：

ngOnInit() {
    this.form.requester = localStorage.getItem(`name`);
    this.form.data.requested_date = new Date();
    /* resulting error Cannot set property 'requested_date' of null */
}

Answer 1

在设置请求日期之前，您需要为表单的data属性分配一个空对象。否则数据为null，因此引发错误。要修复它，

在将requested_date设置为之前添加一行，

this.form.data = {};

Answer 2

Sajeetharan的答案是正确的，并且有效。我将设法阐明一些疑惑。

您正在将this.form.data设置为null并使用接口进行类型转换，但是this.form.data仍然为null而不是对象。

我相信您可以使用--strictNullChecks编译TS以避免这种混淆，从而避免将null或undefined分配给任何内容。

无论如何，我认为您要么使用与期望的相同的类型来初始化表单，要么：

form = {
    data: {} as IMediaStorageAdd,
    requester: '' as string
}

或者您需要在使用之前初始化表单数据：

1）如果有一个实现您的IMediaStorageAdd接口的类

ngOnInit() {
    this.form.requester = localStorage.getItem(`name`);
    // where class MediaStorageAdd implements IMediaStorageAdd
    this.form.data = new MediaStorageAdd();
    // this could be done in the class MediaStorageAdd constructor actually
    this.form.data.requested_date = new Date();
}

2）如果没有类正在实现您的IMediaStorageAdd接口，则应首先将其定义为类型，然后使用对象文字初始化表单数据

export type TMediaStorageAdd {
    requested_date: any;
    place?: string;
    temp_requested_date?: any;
    details?: any[];
}

form = {
    data: null as TMediaStorageAdd,
    requester: null as string
}

ngOnInit() {
    this.form.requester = localStorage.getItem(`name`);
    this.form.data = {
        requested_date = new Date();
    }
}

为什么分配给属性结果错误“无法设置null属性”

2 个答案: