title: Angular JS file upload: ng-accept does not work properly
body: <p>I want to let the user only upload *.txt file with the Angular JS File Upload Plugin (<a href="https://github.com/danialfarid/angular-file-upload" rel="nofollow">https://github.com/danialfarid/angular-file-upload</a>). I have the following problem:</p>
  
  <p>Somehow, when I drag a .txt-file to the dropbox, the class of the dropbox div does not change to the accept-class (= "dragover") but will be the reject-class (= "dragover-err"). Does anybody see the error?</p>
  
  <p><strong>HTML:</strong></p>
  
  <pre><code>&lt;input id="upload" type="file" ng-model="files" ng-file-select="onFileSelect($files)" ng-accept="'.txt'"&gt;
  &lt;button ng-click="clickUpload()" class="button-file-upload"&gt;Datei hochladen&lt;/button&gt;
  
  &lt;div ng-file-drop ng-model="files" class="drop-box"
          ng-multiple="false" allow-dir="false"
          ng-accept="'.txt'" ng-show="!fileUploadFinished"                 
          drag-over-class="{accept:'dragover', reject:'dragover-err', delay:100}" ng-hide="fileUploadFinished"&gt;Drop Images or PDFs files here&lt;/div&gt;
  
  &lt;div ng-no-file-drop&gt;File Drag/Drop is not supported for this browser&lt;/div&gt;
  </code></pre>
  
  <p><strong>JS:</strong></p>
  
  <pre><code>app.controller('fileUploadCtrl', function($rootScope, $scope, $upload) {
      $scope.fileUploadFinished = false;
  
      $scope.$watch('files', function () {
          $scope.onFileSelect($scope.files);
      });
  
      $scope.onFileSelect = function($files) {
          for (var i = 0; i &lt; $files.length; i++) {
              var file = $files[i];
              $scope.upload = $upload.upload({
                  url: 'system/upload.php',
                  method: 'POST',
                  file: file
              }).progress(function(evt) { 
                   // progress bar ... 
              }).success(function(data, status, headers, config) {
                  // file is uploaded successfully
              });
          }
      };
  });
  </code></pre>
  
  <p><strong>Edit:</strong>
  I adapted the fiddle by the creator of the plugin and added the accept and ng-class directives with the goal of getting a green border ONLY when you drag a txt-file. It still does not work. Anybody maybe knows the trick? <a href="http://jsfiddle.net/nmdcwf3w/166/" rel="nofollow">http://jsfiddle.net/nmdcwf3w/166/</a></p>