angular2-img-cropper icon indicating copy to clipboard operation
angular2-img-cropper copied to clipboard

`setImage` as an input

Open altschuler opened this issue 8 years ago • 2 comments

It would be very useful to be able to set the image data through an input. Current I'm wrapping the cropper in another component that takes the image data as input and calls setImage on the cropper during ngAfterViewInit:

import { Component, Input, ViewChild, AfterViewInit, ChangeDetectionStrategy } from '@angular/core';
import { ImageCropperComponent as Ng2ImageCropperComponent, CropperSettings } from 'ng2-img-cropper';

@Component({
    selector: 'pt-image-cropper',
    template: '<img-cropper #cropper [image]="data" [settings]="settings"></img-cropper>',
    changeDetection: ChangeDetectionStrategy.OnPush,
})
export class ImageCropperComponent implements AfterViewInit {

    @Input() settings: CropperSettings;
    @Input() data: any;
    @Input() image: HTMLImageElement;

    @ViewChild('cropper', Ng2ImageCropperComponent)
    cropper: Ng2ImageCropperComponent;

    constructor() { }

    ngAfterViewInit() {
        this.cropper.setImage(this.image);
    }
}

Thank you very much for this great project!

altschuler avatar Dec 16 '16 08:12 altschuler

Do you need this released quickly? I am quite tight with the schedule to do the change but if you can do a pull request I will be glad to integrate, test and release it ASAP.

thanks for contributing!

cstefanache avatar Dec 16 '16 09:12 cstefanache

No, it's no hurry, the solution above works for now. I've got a really tight schedule myself as well, so I will have no time to do a PR right at this moment, but will be happy to work it out later on :)

altschuler avatar Dec 16 '16 09:12 altschuler