私のasp.net webapiコントローラにanglejs

Question

から画像ファイルをアップロードしようとしています。今、私はファイルをAngiPressのasp.net Web APIコントローラに送る必要があります。私はいくつかの質問をしました。 （私はどこが間違っているのかわかりません）その助けてくれません。誰でも私がそれを解決するのを助けることができます。私の意見で

HTML

<input type="file" file="file" fil onchange="angular.element(this).scope().photoChanged(this.files)" /> 
       <img ng-src="{{ thumbnail.dataUrl }}"width="150" height="150" /> 

角度コントローラ

//this is to preview the uplaode image  
$scope.thumbnail = { 
      dataUrl: 'adsfas' 
     }; 
     $scope.fileReaderSupported = window.FileReader != null; 
     $scope.photoChanged = function (files) { 
      if (files != null) { 
       var file = files[0]; 
       if ($scope.fileReaderSupported && file.type.indexOf('image') > -1) { 
        $timeout(function() { 
         var fileReader = new FileReader(); 
         fileReader.readAsDataURL(file); 
         fileReader.onload = function (e) { 
          $timeout(function() { 
           $scope.thumbnail.dataUrl = e.target.result; 
          }); 
         } 
        }); 
       } 
      } 
     }; 
//after the button pressed 
     $scope.AddBanner = function() { 


var request = $http({ 
       method: 'POST', 
       url: urls.api + 'Banner/PostBanner', 
       data: data, 
       ContentType: multipart/form-data; 
       processData: false, 
       //data: JSON.stringify(dataObj) 



      }).success(function (data, status) { 
       alert('saved succesfully'); 
      }) 
     .error(function (error) { 
      $scope.status = 'Unable to upload Banner Details : ' + error.message; 
      console.log($scope.status); 
     }); 

     }; 

Answer 1

それは、このためにディレクティブを使用することをお勧めします。たとえば、https://github.com/danialfarid/ng-file-uploadのようになります。進行状況の報告などを行い、ブラウザ間の互換性の問題を解決します。ここで再び車輪を発明する必要はありません。