title: Uploading files using Angular/C#
body: <p>I have a client built in Angular. I am trying to upload files that are to be processed by the asp.net server side code. Although I have managed to get files in the file control but I don't know how I can pass the binary data to server side. My client side code looks as follows</p>
  
  <p>HTML Code</p>
  
  <pre><code>&lt;div&gt;
  &lt;form name="form1" method="POST" enctype="multipart/form-data"&gt;
      &lt;div&gt;
          {{repopulatecftcModel.title}}
      &lt;/div&gt;
      &lt;div style="padding-top:15px;padding-bottom:15px;"&gt;&lt;b&gt;Toolkit - Repopulate Cftc Data&lt;/b&gt;&lt;/div&gt;
      &lt;div&gt;
          &lt;input type="file" id="updCftcFileUploader" name="files[]" multiple /&gt;
      &lt;/div&gt;
      &lt;div&gt;
          &lt;input type="button" value="Upload Files" title="Upload Files" ng-click="UploadCFTCFiles()" /&gt;
      &lt;/div&gt;
      &lt;div&gt;
          &lt;label ng-model="repopulatecftc.validationtext"&gt;&lt;/label&gt;
      &lt;/div&gt;
      &lt;div&gt;
          {{repopulatecftcModel.validationtext}}
      &lt;/div&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p></p>
  
  <p>Controller Code in Angular</p>
  
  <pre><code>function controller($scope, $http, AppModel, WebFunctionService) {
  
          $scope.UploadFiles = function (evt) {
  
              var files = document.getElementById('updFileUploader').files;
              for(var i = 0; i &lt; files.length; i++) {
                  var file = files[i];
                  if (file) {
                      //  getAsText(file);
                      alert("Name: " + file.name + "\n" + "Last Modified Date :" + file.lastModifiedDate);
                  }
              }
              var parameters = { directory: $scope.defaultsSaveDirectory, filename: "" };
              WebFunctionService.promiseWebMethod('UploadFiles', angular.fromJson(parameters), true)
                  .success(function () {
                      $scope.userMessage = "File(s) successfully uploaded";
                      console.log($scope.userMessage);
                  })
                  .error(function (error) {
                      $scope.userMessage = "ERROR uploading files" + error;
                      console.log($scope.userMessage);
                  });
  
          };
  
      }; 
  </code></pre>
  
  <p>Server side code where I want to access the uploaded files from</p>
  
  <pre><code>[Route("UploadFiles")]
      [HttpPost]
      public void UploadFiles()
      {
  
      }
  </code></pre>
  
  <p>When I run the code I do get alerts for each of the file being uploaded. Then the code get into the server side as shown in the image below</p>
  
  <p><img src="https://i.stack.imgur.com/KavTe.jpg" alt="Server side code"></p>
  
  <p>Its here that I want to access the files from. I have seen in the web where they show Request.Files shows the collection of files being uploaded but when I try to do that the compiler starts complaining.</p>
  
  <p><img src="https://i.stack.imgur.com/9lEJa.jpg" alt="Compiler error when using Request.Files"></p>
  
  <p>Anyone have any clues as to how I should be able to pass binary data being uploaded from client side in this case and access it from the server side</p>