首页 > 解决方案 > 角度图像上传不适用于 Internet Explorer,但它适用于谷歌浏览器

问题描述

我已经成功实施,适用于除 Internet Explorer 11 以外的所有浏览器。我正在使用 Internet Explorer 11,并且我已实施我已成功在 Google Chrome 中上传.jpeg、.jpg 和 .png图像,但无法在 IE 中上传11
此代码在谷歌浏览器开发和生产中完美运行,但在 IE11 中无法正常工作,
我可以在谷歌浏览器中上传 jpeg、jpg、png 所有尺寸的图像,但无法在 IE11 中上传任何类型的图像。

<div class="form-group">
  <label class="form-control-label" jhiTranslate="companyManagement.new-logo">Upload new Logo</label>
  <input class="tdw-display-none" (change)="onFileChange($event, 'logo')" type="file"
           formControlName="logo" placeholder="Company logo">

onFileChange($event, doc: string) {
const files = $event.target.files;
if (files && files.length > 0) {
  const fileType: string = files[0].type;
  const fileSize: number = files[0].size;
  if (fileType) {
    if (fileType.includes('png') || fileType.includes('jpeg') || fileType.includes('jpg')) {
      this.image.name = files[0].name;
      this._compressImage(files[0], fileData => {
        this.image.data = fileData;
        this._mLogo = fileData;
        this.company.logo = fileData.split(',')[1];
      });
    } else {
      console.log('--------------Invalid File Type----------');
    }
  }
}

}

private bytesToSize(bytes) {
    const sizes = ['Bytes', 'KB', 'MB', 'GB', 'TB'];
    if (bytes === 0) {
      return 'n/a';
    }
    const i = Math.floor(Math.log(bytes) / Math.log(1024));
    if (i === 0) {
      return bytes + ' ' + sizes[i];
    }
    return (bytes / Math.pow(1024, i)).toFixed(1) + ' ' + sizes[i];
  } 

    private _compressImage(file, callback) {
    this.ng2ImgMaxService.resize([file], 600, 600).subscribe(
      result => {
        this._readImageAndLoad(result, callback);
        console.log("after _readImageAndLoad");
      },
      error => {
        console.error('---------------Resize error-------------', error);
      }
    );
  }  

    private _readImageAndLoad(file, callback) {
    const reader = new FileReader();
    reader.onload = (e: any) => {
      const dataUrl = e.target.result;
      const base64 = dataUrl.split(',')[1];
      console.log(" _readImageAndLoad");
      callback(dataUrl);
    };
    reader.readAsDataURL(file);
  }

标签: javascripthtmlarraysangularimage

解决方案


您正在使用箭头函数( the () => {})。

IE11 不支持它们,因此您必须将它们更改为旧的实现方式。例子:

  error => {
    console.error('---------------Resize error-------------', error);
  }

  //Should be

 function(error) {
    console.error('---------------Resize error-------------', error);
  }

推荐阅读