Angular: Empty Fiddle

http://angularjs.org/

by Ryan Eballar

HTML

<script src="http://code.angularjs.org/angular-1.0.1.js"></script>
<div ng-controller="MyCtrl">
  Hello, {{name}}!
       <input id="filechooser" type="file" multiple onchange="angular.element(this).scope().addFilesToUpload(this)" />
       <h3>List of Uploads</h3>
       <table>
          <tbody>
             <tr ng-repeat="up in uploadList" ng-click="setSelected(up)">
                 <td><span ng-class="{selected: selectedUpload == up}">{{up.Name}}</span>
                     : {{up.NewFiles.length}}
                 </td>
             </tr>
          </tbody>
       </table>
       <hr>
       <h3>Selected Upload List</h3>
       <table>
           <tbody>
              <tr ng-repeat="file in selectedUpload.NewFiles">
                 <td>{{file.name}}</td>
              </tr>
           </tbody>
       </table>
</div>

CSS

.selected {
    color: orange;
}

JavaScript

var myApp = angular.module('myApp',[]);

function MyCtrl($scope) {
    $scope.name = 'Superhero';
    $scope.uploadList = [{Name: "Test Upload",
                       Id: 1,
                       NewFiles: []
                     }];
     $scope.selectedUpload = $scope.uploadList[0];
     $scope.setSelected = function(upload) {
        $scope.selectedUpload = upload;
     }
     $scope.addFilesToUpload = function(element){
         $scope.$apply(function() {
            $scope.selectedUpload.NewFiles = element.files;     
         });
        
     }
}