开发者问题收集

对象可能为空。TypeScript 错误(Angular TypeScript)

2021-01-05
3220

我想向“转换”功能添加一个图像文件。

这是我从 component.html 中输入的代码:

<li>
    <label for="avatarIMG" id="avatarLbL"> image: </label>
    <input type="file" accept="image/*" #imageBox name="image" id="avatarinput" (change)="convert($event)">
    <button type="button" id="avatarInputBTN" (click)="imageBox.click()"> Profile Picture </button>
</li>

该事件假设将对象的值(包括所有值 + 图像文件)从表单发送到 component.ts,这是它​​的代码:

public convert(e: Event): void {
    this.eventFiles = (e.target as HTMLInputElement).files[0];
    if (this.eventFiles !== null) {
        this.user.image = this.eventFiles;
        const fileReader = new FileReader();
        fileReader.onload = args => this.preview = args.target?.result?.toString();
        fileReader.readAsDataURL(this.eventFiles);
    }
}

我收到一个错误,对象可能为 null(e.target as HTMLInputElement).files[0]。

我该如何解决这个问题?..

1个回答

尝试这个:

this.eventFiles = (e.target as HTMLInputElement)?.files?.[0];
ABOS
2021-01-05