Utilisation de ngFileUpload avec Cloudinary

Question

J'essaie d'intégrer les paramètres de téléchargement Cloudinary (?) Dans la fonction ngFileUpload. Le function can be found here et permet à un utilisateur de télécharger, puis déposez une image sur la page. J'essaie d'obtenir cette fonctionnalité pour fonctionner, mais au lieu de télécharger la façon dont ngFileUpload dit, pour essayer de l'obtenir à télécharger comme le dit Cloudinary.

Mon contrôleur:

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

Mon modèle:

<div id="myModal2" class="modal"> 
    <div class="modal-content"> 
    <div class="modal-header"> 

    </div> 
    <div class="modal-body"> 
     <form name="myForm"> 
       <div class="uploadText">Crop Image and Upload</div> 
       <i class="material-icons" style="position: relative; bottom: 28px; left:718px; cursor: pointer;" ng-click="vm.closeModal()">close</i> 
       <hr class="add-horizontal-line"> 
       <br><br> 
       <div ngf-select ng-model="picFile" accept="image/*" class="buttn" style="cursor: pointer;width: 200px; position: relative; left: 295px;"> 
        <p style="position: relative; right: 10px; bottom: 3px;">Select Picture</p> 
       </div> 
       <br> 
       <div ngf-drop ng-model="picFile" ngf-pattern="image/*" 
        class="cropArea" style="position: relative; left: 150px;"> 
        <img-crop image="picFile | ngfDataUrl" 
        result-image="croppedDataUrl" ng-init="croppedDataUrl=''" > 
        </img-crop> 
       </div> 
       <br><br> 
       <div class="buttn" style="cursor: pointer; position: relative; left: 295px; bottom:16px;" ng-click="upload(croppedDataUrl, picFile.name2)"><p style="position: relative; left: 29px;">SUBMIT</p></div> 

       <span ng-show="result2">Upload Successful</span> 
       <span class="err" ng-show="errorMsg">{{errorMsg}}</span> 
      </form> 
     </div> 
     <footer style="background-color: RGBA(211,211,211,0.2); height: 75px; "> 
      <div class="buttn" style="cursor: pointer; position: relative; left: 75%; top: 12px;"><p style="margin-left: 35px;" ng-click="vm.closeModal()">DONE</p></div> 
     </footer> 
    </div> 
</div> 

La fonction cloudinary:

cloudinary.upload(file, {upload_preset: 'dbyhcyty'}) 

Est-il possible de combiner ces deux, de sorte que la fonction de la culture de ngfileupload s'exécute, puis télécharge vers cloudager?

Answer 1

Résolu:

 $scope.upload = function (dataUrl, name2) { 
      console.log("name2", dataUrl); 
      cloudinary.upload(dataUrl, {upload_preset: 'dhjgcyty'}) 
      .then(function(response){ 
       $scope.result = response.data; 
       console.log($scope.result); 
      }); 
     }