AngularJS, angular-file-upload issue, I can't get $file

Question

I'm trying to use https://github.com/danialfarid/angular-file-upload but apparently I can't access the file

my HTML

 <img 
    src = "{{ userPhotoUrl }}"
    alt = ""
    class = "img-circle img-responsive"
    accept = "image/*"
    data-multiple = "false"
    ng-file-select = "onFileSelect($file)"
>

my Coffescript:

$scope.onFileSelect = ($file) ->
  console.log $file
  $scope.upload = $upload.upload
    url : '/api/upload/photo'
    file : $file
    method : 'POST'
  .progress (e) ->
    console.log 'percent' + parseInt 100.0 * e.loaded / e.total
  .success (data, status, headers, config) ->
    console.log data, status, headers, config

I just get undefined from the console.log($file)

What can be wrong? I tried to put the same logic in

<input type="file" ng-file-select="onFileSelect($file)">

But I get the same result

Answer 1

In HTML change $file to $files

ng-file-select = "onFileSelect($files)"

That's something exposed by the file upload, like similarly you can use $last or $first together with ng-repeat