Jшибка увеличения фото в angular-cropperjs, с помощью mat-slider
Здравствуйте, вот моя проблема.
У меня есть mat-slider на который я пытаюсь добавить функцию cropper.zoom, из библиотеки angular-cropperjs, чтобы по передвижению ползунка менять масштаб фото. Пока смог добиться результата приближения и отдаления с помощью нажатия на кнопоки. Во время перетягивания ползунка введет себя некорректно.
//cropper
@ViewChild('cropperObj', { static: false }) public cropperObj: CropperComponent;
//slider
autoTicks = false;
disabled = false;
invert = false;
showTicks = false;
thumbLabel = false;
vertical = false;
max = 1;
min = -1;
step = 0.01;
value = 0;
// зум +
zommUp() {
this.cropperObj.cropper.zoom(0.1);
}
// зум -
zoomDown() {
this.cropperObj.cropper.zoom(-0.1);
}
// слайдер
onInputChange(event: MatSliderChange) {
this.cropperObj.cropper.zoom(+"0.0" + event.value);
console.log(this.value, event.value);
}
<mat-slider class="m-1" (input)="onInputChange($event)" [invert]="invert" [max]="max" [min]="min" [step]="step" [thumbLabel]="thumbLabel" [tickInterval]="tickInterval" [value]="value" [vertical]="vertical"> </mat-slider> <button mat-icon-button class="dialog-b" mat-raised-button (click)="zommUp()"><i class="fas fa-plus"></i> </button> <button mat-icon-button class="dialog-b" mat-raised-button (click)="zoomDown()"><i class="fas fa-minus"></i> </button> |
| Часовой пояс GMT +3, время: 09:40. |