title: Angular event not working in Firefox
body: <p>I have an angular function that allows to drop a text file into a textarea and the contents are placed into the textbox.  The issue is this does not work in Firefox.  Any ideas?</p>
  
  <p><a href="http://plnkr.co/edit/D8hu32H0tPYnx64ZjW57?p=preview" rel="nofollow">PLunkr</a></p>
  
  <pre><code>var app = angular.module('plunker', []);
  app.controller('MainCtrl', function($scope) {
    $scope.text = "";
  })
  .directive('plkrFileDropZone', [function () {
          return {
              restrict: 'EA',
              scope: {content:'='},
              link: function (scope, element, attrs) {
  
          scope.content = "drop a .txt file here";
  
                  var processDragOverOrEnter;
  
                  processDragOverOrEnter = function (event) {
                      if (event !== null) {
                          event.preventDefault();
                      }
                      event.dataTransfer.effectAllowed = 'copy';
                      return false;
                  };
  
                  element.bind('dragover', processDragOverOrEnter);
                  element.bind('dragenter', processDragOverOrEnter);
                  element.bind('drop', handleDropEvent);
  
          function insertText(loadedFile) {
  
                  scope.content = loadedFile.target.result;
            scope.$apply();
          }
  
                  function handleDropEvent(event) {
  
                      if (event !== null) {
                          event.preventDefault();
                      }
                      var reader = new FileReader();
                      reader.onload = insertText;
                      reader.readAsText(event.dataTransfer.files[0]);
  
                  }
              }
          };
      }]);
  </code></pre>