在Angular 9中,可以通过以下步骤实现在点击上传文件前显示图片的功能:
<input type="file" (change)="onFileSelected($event)">
<img *ngIf="imageUrl" [src]="imageUrl" alt="Selected Image">
imageUrl: string;
onFileSelected(event: any) {
const file: File = event.target.files[0];
const reader = new FileReader();
reader.onload = (e: any) => {
this.imageUrl = e.target.result;
};
reader.readAsDataURL(file);
}
这样,当用户选择了一个图片文件后,该图片将会在点击上传文件之前显示在页面上。
关于Angular 9的更多信息和使用方法,可以参考腾讯云的Angular产品文档:Angular产品介绍。
请注意,以上答案仅供参考,具体实现方式可能因项目需求和开发环境而有所不同。
领取专属 10元无门槛券
手把手带您无忧上云