如何使用angularjs中的ng-file上传来裁剪和上传图像

时间:2021-11-21 12:13:14

Hello I am trying to crop my image and upload a image using ng-file upload in angularjs.

您好我正在尝试裁剪我的图像并使用angularjs中的ng-file上传图像。

I am getting canvas data after cropping. Then how to covert that data to file and upload to server using ng file upload.

裁剪后我得到画布数据。然后,如何使用ng文件上传将该数据转换为文件并上传到服务器。

Thanks in advance.

提前致谢。

1 个解决方案

#1


1  

Try to discover this example. I think it's can be help you.

尝试发现这个例子。我想这可以帮到你。

$scope.upload = function (dataUrl) {
    Upload.upload({
        url: 'https://angular-file-upload-cors-srv.appspot.com/upload',
        data: {
            file: Upload.dataUrltoBlob(dataUrl)
        },
    }).then(function (response) {
        $timeout(function () {
            $scope.result = response.data;
        });
    }, function (response) {
        if (response.status > 0) $scope.errorMsg = response.status 
            + ': ' + response.data;
    }, function (evt) {
        $scope.progress = parseInt(100.0 * evt.loaded / evt.total);
    });
}

full jsfiddle

完整的jsfiddle

#1


1  

Try to discover this example. I think it's can be help you.

尝试发现这个例子。我想这可以帮到你。

$scope.upload = function (dataUrl) {
    Upload.upload({
        url: 'https://angular-file-upload-cors-srv.appspot.com/upload',
        data: {
            file: Upload.dataUrltoBlob(dataUrl)
        },
    }).then(function (response) {
        $timeout(function () {
            $scope.result = response.data;
        });
    }, function (response) {
        if (response.status > 0) $scope.errorMsg = response.status 
            + ': ' + response.data;
    }, function (evt) {
        $scope.progress = parseInt(100.0 * evt.loaded / evt.total);
    });
}

full jsfiddle

完整的jsfiddle