title: Unable to loop through string array and append to FormData
body: <p>I am developing a file upload module in AngularJS. I will be having multiple file controls and each control can upload one file at a time (not multiple). Finally on click of submit I am saving all the files. I am dynamically generating file controls using <code>ng-repeat</code> as below.</p>
  
  <pre class="lang-html prettyprint-override"><code> &lt;div class="upload-button" ng-repeat="fileInput in fileInputs"&gt;
                  &lt;div class="upload-button-icon"&gt;
                      &lt;img src="images/folder-small.png"&gt;
                      &lt;div class="upload-text"&gt;{{fileInput}}&lt;/div&gt;
                      &lt;input type="file" file-data="{{fileInput}}" file-model="{{fileInput}}" /&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
  </code></pre>
  
  <p>JS code to assign values to file controls     </p>
  
  <pre><code>$scope.fileInputs = ["Passport","Visa"];
  </code></pre>
  
  <p>Below is my code to upload files.</p>
  
  <pre><code>myapp.factory('fileUpload', ['$http', function ($http) {
      var fileuploadurl = "http://localhost:19144/" + 'api/Customer/UploadLeaseFiles/' + 2;
      var service = {
          uploadUrl: fileuploadurl,
          pendingFiles: [],
          doUpload: doUpload
      };
      return service;
      function doUpload() {
          debugger;
          var files = new FormData();
          angular.forEach(this.pendingFiles, function (value, index) {
              files.append('file', value);
              files.append('IndexValue', index);
  
          });
          return $http.post(this.uploadUrl, files, {
              transformRequest: angular.identity,
              headers: {
                  'Content-Type': undefined
              }
          })
      }
  }]);
  </code></pre>
  
  <p>This is my directive code.</p>
  
  <pre><code>myapp.directive('fileModel', ['fileUpload', function (fileUpload) {
      return {
          restrict: 'A',
          link: function (scope, element, attrs) {
              element.bind("change", function (evt) {
                  fileUpload.pendingFiles[attrs.fileModel] = evt.target.files[0];
              });
          }
      };
  }]);
  </code></pre>
  
  <p>Above code will work only if I assign integers to fileInputs as:</p>
  
  <pre><code>$scope.fileInputs = [1,2,3];
  </code></pre>
  
  <p>I am struggling to understand why it is working if I assign integer to fileinputs. How can I assign strings and make the above code work?</p>