我想使用 angular2 构建一个文件上传(基于 Angular2 - Display image ),它上传原始图像但显示调整大小的图像作为缩略图预览。
上传前 图像必须在文件输入字段下方显示为缩略图。现在图像元素正在显示一个 base64 字符串并且一切正常......但是!
getInput(fileInput) {
const reader = new FileReader();
reader.onload = ((e: any) => {
this.logo = e.target.result;
});
reader.readAsDataURL(fileInput.target.files[0]);
}
如果我想通过添加内联 css 来更改图像大小,例如图像元素的宽度为 33px,图像质量非常差:
<input type="file" class="form-control" (change)="getInput($event)" name="qr.logo"/>
<img [src]="logo" [width]="33" >
有没有办法在没有或低质量损失的情况下调整图像的 Angular ?
最佳答案
您可以使用 angular2-img-cropper 包来调整图像的大小。 https://github.com/cstefanache/angular2-img-cropper
关于Angular2 调整输入图像的大小,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44259269/