Code/Resize 使用 ionic 或 angular9 的 Base64 大图像（不使用 Javascript）

Question

我在 ionic 中得到了一张大图片，所以我需要对其进行编码或调整其大小。我很迷路......这可能吗？到目前为止我的代码是：

base64 = 'data:image/jpeg;base64, ';
defaultAvatar = './assets/img/resources/img-avatar.png';

if (this.staffService.getStaff() === null) {
      this.staffService.staffInfo().subscribe(data => {
        this.staffData = this.staffService.mapStaffData(data);
        this.avatar_imagen = this.staffData.image ?
          this.domSanitizer.bypassSecurityTrustResourceUrl(
            this.base64 + this.staffData.image
          )
          : this.defaultAvatar;
      });
    } else {
      this.staffData = this.staffService.getStaff();
      this.avatar_imagen = this.staffData.image ?
        this.domSanitizer.bypassSecurityTrustResourceUrl(
          this.base64 + this.staffData.image
        )
        : this.defaultAvatar;
    }

使用的语言必须是 Ionic 或 Angular。（不使用 Javascript）谢谢大家

Answer 1

尝试使用 ng2-img-cropper 在上传前调整图片大小。此外，您可以自定义维度。

您可以安装名为 ng2-img-cropper:

的软件包

npm install ng2-img-cropper --save

You can read more about ng2-img-cropper here

如果你想避免额外的包裹，那么 you can use this TypeScript version of image resizing.

此外，there is a little bit simplier example。但是，您还需要在某个地方创建 canvas 并且您可以使用 ViewChild 来处理它。

Code/Resize 使用 ionic 或 angular9 的 Base64 大图像（不使用 Javascript）

Code/Resize massive image in Base64 using ionic or angular9 (NOT using Javascript)

base64

image-compression

ionic-framework

angular

angular9