ng img crop-裁剪現有圖像

Question

ng-img-crop是一個很棒的指令，但是我很難適應它。 我的問題是，當用戶擁有圖像時，如果他們願意，我想給他們選擇調整圖像大小的選項。

因此，這是我嘗試使用的代碼：

js：

vm.userImageOriginal = vm.editUser.image_pkey ? 'api/file/' + vm.editUser.image_pkey : null;

的HTML：

<img-crop image="profileVM.userImageOriginal" result-image="profileVM.userImageNew"
                                          area-type="square" result-image-size="300" on-change="profileVM.imageCropped = true;"></img-crop>

所以我有兩個問題：

1）如果用戶確實更改了裁剪，我只想上傳新圖像。 我嘗試在on-change中設置一個標志，但是看起來on-change也可以在初始化時執行。 有什么方法可以知道用戶是否實際裁剪了嗎？

2）有什么方法可以設置正方形/圓形的位置。 在我的方案中，如果存在現有的用戶圖像，我想將裁剪正方形設置為當前圖像的尺寸（即圖像的邊框）。

提前致謝。

Answer 1

像這樣解決：

將以下屬性添加到html中的ng-img-crop指令中：

on-load-done="profileVM.addCroppingWatcher()"

這是函數：

function addCroppingWatcher(){
            if (croppingWatcher)
                return;

            $window.setTimeout(function(){
                croppingWatcher = $scope.$watch(
                    function(){ return vm.userImageNew; },
                    function(newVal, oldVal){
                        if (oldVal && oldVal != newVal) {
                            vm.imageCropped = true;
                            croppingWatcher();
                        }
                    }
                );
            }, 0);
        }