title: Upload file to firebase with angular / angularjs
body: <p>I'm using the following to upload images on my firebase storage via angular / angularfire:</p>
  
  <pre><code>&lt;form ng-submit="uploadFile(file)"&gt;
    &lt;input type="file" accept="txt" file-model="file" class="form-control"&gt;
    &lt;button type="submit" class="btn btn-primary"&gt;Upload File&lt;/button&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>and js:</p>
  
  <pre><code>app.directive('fileModel',['$parse', function ($parse){
   return {
  restrict: 'A',
  link: function (scope, element, attrs) {
    element.bind('change', function () {
      $parse(attrs.fileModel)
      .assign(scope, element[0].files[0])
      scope.$apply();
    })
  }
  }
  }]);
  
  app.controller('myController', ['$scope', '$firebaseStorage', function($scope,     $firebaseStorage) {
  
   // Create a Firebase Storage reference
   var storage = firebase.storage();
   var storageRef = storage.ref();
   var filesRef = storageRef.child('files');
  
   $scope.uploadFile = function(file) {
  console.log("Let's upload a file!");
  console.log($scope.file);
  var storageRef = firebase.storage().ref("files");
  // var storageRef = firebase.storage().ref("files");
  $firebaseStorage(filesRef).$put($scope.file);
  };
  
   }]);
  </code></pre>
  
  <p>The problem is if I upload another image after, it will replace the previous one uploaded ( I suppose it's due to the fact the file name is being taken as 'files', and so replace it automatically)</p>
  
  <p>Is there a way to avoid this? For example, to upload the image with the name of the file instead?</p>
  
  <p>How the path should be?</p>
  
  <p>Thanks a lot for your help</p>