如何在上传前预览图像使用ngx文件放入angular 6？

我使用“文件拖放”标签在Angular 6上拖放图像

 <file-drop headertext="{{adCrud.uploadMediaText}}"
    (onFileDrop)="dropped($event)" (onFileOver)="fileOver($event)"
    customstyle="filedrop" customstyle="adMedia"
    (onFileLeave)="fileLeave($event)" >

注意：我正在尝试实现以下方法，但能否找到event.target？from（onFileDrop）=“已删除（$event）”

media1change（事件）{
if（event.target.files&&event.target.files[0]）{
const reader=new FileReader（）；
//tslint:禁用下一行：无阴影变量
reader.onload=（事件：ProgressEvent）=>{
this.adCrud.media1=（event.target）.result；
////console.log（this.profile）；
//这是uploadmedia1（）；
};
reader.readAsDataURL（event.target.files[0]）；
}
this.media1File=event.target.files[0]；
this.uploadmedia1（）；}

文件条目是FileSystemEntry的一个实例，但如果上载的是文件而不是文件夹，则

文件条目

实际上是一个

FileSystemFileEntry

实例。这意味着它有

file（）

方法，您可以这样做：

imageDropped($event: UploadEvent) {
        const droppedFile = $event.files[0];
        const fileEntry = droppedFile.fileEntry as FileSystemFileEntry;
        const reader = new FileReader();

        fileEntry.file(file => {
            reader.readAsDataURL(file);
            reader.onload = () => {
                this.imageUrl = reader.result;
            };
        });
    }

---

您的最后一个注释对我来说似乎不是很清楚。//我正在尝试像（更改）=“myFuc（$event）”一样实现，但是（onFileDrop）=“droped（$event）”失败，并且错误为event.target或event.target.files[0]为空。我只想显示从（onFileDrop）=“droped（$event）”获取的图像文件在它上传到服务器之前，你能提供一个例子吗

media1change(event) {
    if (event.target.files && event.target.files[0]) {
      const reader = new FileReader();

      // tslint:disable-next-line:no-shadowed-variable
      reader.onload = (event: ProgressEvent) => {
        this.adCrud.media1 = (<FileReader>event.target).result;
        // // console.log(this.profile);
        // this.uploadmedia1();
      };

      reader.readAsDataURL(event.target.files[0]);
    }
    this.media1File = event.target.files[0];
    this.uploadmedia1();    }

imageDropped($event: UploadEvent) {
        const droppedFile = $event.files[0];
        const fileEntry = droppedFile.fileEntry as FileSystemFileEntry;
        const reader = new FileReader();

        fileEntry.file(file => {
            reader.readAsDataURL(file);
            reader.onload = () => {
                this.imageUrl = reader.result;
            };
        });
    }

<img [src]="**imageUrlPREVIEW**">

imageUrlPREVIEW;
...
const droppedFile = event.files[0];
const fileEntry = droppedFile.fileEntry as FileSystemFileEntry;
const reader = new FileREader();
fileEntry.file((file: File) => {
     reader.readASDAtaURL(file);
     reader.onload = () => {
         **this.imageUrlPREVIEW**= reader.result;
     };
});