AngularJS 1.2.x file upload

var app = angular.module('plunker', ['angularFileUpload']);

app.controller('MainCtrl',['$scope', '$upload', function($scope, $upload) {
    
    
    $scope.onFileSelect = function($files) {


      console.log($files); // undefined
      //$files: an array of files selected, each file has name, size, and type.
      for (var i = 0; i < $files.length; i++) {
        var file = $files[i];
        $scope.upload = $upload.upload({
          url: '/cards/avatar/save_from_disk', //upload.php script, node.js route, or servlet url
          data: {
            myObj: $scope.myModelObj
          },
          file: file,
        }).progress(function(evt) {
          console.log('percent: ' + parseInt(100.0 * evt.loaded / evt.total));
        }).success(function(data, status, headers, config) {
          // file is uploaded successfully
          console.log(data);
        });
      }
    };
  }
]);

<!DOCTYPE html>
<html ng-app="plunker">

  <head>
    <meta charset="utf-8" />
    <title>AngularJS Plunker</title>
    <script>document.write('<base href="' + document.location + '" />');</script>
  
    <link rel="stylesheet" href="style.css" />
    <script data-require="angular.js@1.2.x" src="https://code.angularjs.org/1.2.22/angular.js" data-semver="1.2.22"></script>
      <script src="http://angular-file-upload.appspot.com/js/angular-file-upload.js"></script>
    <script src="app.js"></script>
  </head>

  <body ng-controller="MainCtrl">

    <input type="file" title="" accept="image/*"  ng-file-select="onFileSelect($files)" class="upload" />
  </body>

</html>

/* Put your css in here */