Object 可能是 null。 TypeScript 錯誤（角度打字稿）

Question

我想添加一個圖像文件來“轉換”function。

這是我的來自 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>

該事件假設將 object 的值與所有值 + 圖像文件從表單發送到 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);
    }
}

我收到 object 的錯誤，可能是 null for (e.target as HTMLInputElement).files[0]。

我怎樣才能解決這個問題？..

Answer 1

嘗試這個：

this.eventFiles = (e.target as HTMLInputElement)?.files?.[0];