How to change cropping image width and height dynamically??

[sureshkoduri]

Hi, I want to change cropper width and height dynamically and I am doing the below

<image-cropper image-url="{{imageURL}}"
                                              width="{{cropper.width}}"
                                              height="{{cropper.height}}"
                                              show-controls="true"
                                              fit-on-init="false"
                                              center-on-init="true"
                                              crop-callback="setSelectedTileBg"
                                              ng-if="imageURL"
                                            ></image-cropper>

In controller Im using

$scope.cropper = { width:$element.context.offsetWidth,height:$element.context.offsetHeight};

Any help??

[bcabanes]

Hi @sureshkoduri, Right now the directive initialize itself with the configuration given. The width and height are used to calculate all the needed value (ratio, boundaries etc...) of the cropper. So changing dynamically these value is not easy. However, you can change these values then reInitialize the directive. There is multiple ways to achieve this, like create another directive to wrap the cropper's, using $compile...

Hope i gave you some clues 🙂

[sureshkoduri]

Thank you @bcabanes

Can you tell me a way to reInitialize the directive?