0

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）有什么方法可以设置正方形/圆形的位置。在我的场景中，如果有一个现有的用户图像，我想将裁剪正方形设置为当前图像的尺寸（即图像的边框）。

提前致谢。

4

1 回答 1

0

像这样解决：

将以下属性添加到 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);
        }
于 2015-12-30T19:58:10.160 回答