Сброс положения к исходному с AngularMaterial + cdkDrag - PullRequest
0 голосов
/ 09 октября 2019

Я создал средство просмотра изображений, которое позволяет вам увеличивать и масштабировать изображение. Он работает нормально, с одной проблемой, я не могу найти собственный способ с Material CDK, чтобы сбросить изображение в исходное положение, когда источник изображения изменяется, как я делаю для масштабирования изображения в этом примере:

export class ImageComponent implements OnInit, OnChanges {
  @Input() src: string;
  @Input() height: number;
  @Input() alt: string;
  @Input() zoomFactor = 0.1;
  @Input() wheelZoom = 0.1;

  get transform() {
    const transform = `translate(${this.translateX}px, ${this.translateY}px) rotate(${this.rotation}deg) scale(${this.scale})`;
    return this.sanitizer.bypassSecurityTrustStyle(transform);
  }

  public fullscreen = false;
  public loading = true;
  public scale = 1;
  private rotation = 0;
  private translateX = 0;
  private translateY = 0;
  private prevX: number;
  private prevY: number;
  private hovered = false;

  constructor(protected sanitizer: DomSanitizer) { }

  ngOnInit() {
  }

  ngOnChanges(changes) {
    if (changes.src) {
      this.scale = 1;
    }
  }

  //......
...