将图像转换为Typescript中的base64字符串

Question

我正在尝试从Angular 5将base64字符串发布到我的api

首先，我必须将其从图像转换为base64，在Internet和MDN上进行检查之后，我开发了一种方法

  OnIDChange(event) {
    var file = event.target.files[0];
    var reader = new FileReader();
    reader.onloadend = this.handleReaderLoaded.bind(this, "Id");
    reader.readAsBinaryString(file);
  }

和

    handleReaderLoaded(readerEvt:any, indicator: string) {
     var binaryString = readerEvt.target.result;
     if (indicator == "Id") {
       this.Model.IDPhoto = btoa(binaryString);
     }
  }

我必须将此base64存储在模型属性中才能在api中发布

但是在控制台上，它给出错误“无法读取未定义的属性'结果'”

var binaryString = readerEvt.target.result;

我如何将图像转换为base64，如果还有其他更合适的方法（任何npm包或其他东西，也请让我知道）

提前致谢 。

来自MDN MDN链接的参考

Answer 1

您需要使用readAsDataUrl()：

function getBase64(event) {
   let me = this;
   let file = event.target.files[0];
   let reader = new FileReader();
   reader.readAsDataURL(file);
   reader.onload = function () {
     //me.modelvalue = reader.result;
     console.log(reader.result);
   };
   reader.onerror = function (error) {
     console.log('Error: ', error);
   };
}