Angular: Empty Fiddle

http://angularjs.org/

HTML

<div ng-app="serverExe" 
     ng-controller="someCtrl">
    <form novalidate="">
        <textarea ng-model="results"></textarea><br/>
        <input type="text"
               ng-model="query.first"/><br/>
        <input type="button" value="Search"
               ng-click="search()"/><br/>
        <input type="file" on-read-file="displayFileContents(contents)" /><br/>
    </form>
</div>

JavaScript

var exeApp = angular.module('serverExe', [])
.directive('onReadFile', function ($parse) {
    return {
        restrict: 'A',
        scope: false,
        link: function(scope, element, attrs) {
            element.bind('click', function() {
                element.val(null);
            });
            element.bind('change', function(e) {
                
                var onFileReadFn = $parse(attrs.onReadFile);
                var reader = new FileReader();
                
                reader.onload = function() {
                    var fileContents = reader.result;
                    // invoke parsed function on scope
                    // special syntax for passing in data
                    // to named parameters
                    // in the parsed function
                    // we are providing a value for the property 'contents'
                    // in the scope we pass in to the function
                    scope.$apply(function() {
                        onFileReadFn(scope, {
                            'contents' : fileContents
                        });
                    });
                };
                reader.readAsText(element[0].files[0]);
            });
        }
    };
})
.controller('someCtrl', function($scope){

    $scope.displayFileContents = function(contents) {
        console.log(contents);
        $scope.results = contents;
    };

    $scope.query = { 
        'first' : ''
    };
    
    $scope.search = function() {
        $scope.results = "results from http get using query:" + $scope.query.first;
    };
});