typescript 错误类型错误:无法读取未定义的属性'files'

xv8emn3q  于 2022-11-18  发布在  TypeScript
关注(0)|答案(1)|浏览(224)

我正在使用两个Angular (2+)工具:ng 2-文件-上传和angular2-图像-裁剪。
我尝试使用ng 2-file-upload的Dropzone在angular2-img-cropper的裁剪工具中加载图像。如果我更改输入文件(HTMLElement),我实际上可以在裁剪工具中加载选定的图像,但拖放区失败。
下面是我如何使用输入来完成此操作:

HTML格式:

<input type="file" id="file-name" 
                    ng2FileSelect 
                    [uploader]="uploader"
                    (change)="fileChangeListener($event, cropper)"/>

技术支持:

fileChangeListener($event : any, cropperComp: ImageCropperComponent) {

    this.cropper = cropperComp;

    let image = new Image();
    var file:File = $event.target.files[0];
    var myReader:FileReader = new FileReader();
    var that = this;

    myReader.onloadend = function (loadEvent: any) {
        image.src = loadEvent.target.result;
        that.cropper.setImage(image);
    };
    myReader.readAsDataURL(file);

}

正如我所说,这很好用。
但是,当我尝试使用Dropzone时,我收到以下错误:

错误类型错误:无法读取ProfileComponent.fileChangeListener处未定义[...]的属性“files”
HTML(拖放区):

<div ng2FileDrop
                    [ngClass]="{'nv-file-over': hasBaseDropZoneOver}"
                    (fileOver)="fileOverBase($event)"
                    [uploader]="uploader"
                    class="well my-drop-zone"     
                    (onFileDrop)="fileChangeListener($event, cropper)"
                    >
                    Base drop zone
                </div>
h7appiyu

h7appiyu1#

var file:File = $event.target.files[0];

应为:

var file:File = $event.files[0];

相关问题