handle input =file action in directive and assign file data to parent scope key

<!DOCTYPE html>
<html>

  <head>
    <script data-require="angular.js@*" data-semver="1.2.13" src="http://code.angularjs.org/1.2.13/angular.js"></script>
    <link rel="stylesheet" href="style.css" />
    <script src="script.js"></script>
  </head>

  <body>
    <h1>Directive 2 scope talkback</h1>
    <div class="col-md-3 bgLightGrey">
	<input
		type="file"
		placeholder="File upload"
		ng-model="newItem.file"
		upload-file={"img":["jpg","jpeg","bmp","png","gif"],"doc":["doc"],"appl":["pdf"]}
		max-file-size="5">
	</div>
  </body>

</html>

// Code goes here
angular.module('testApp',[])
.directive('uploadFile',function(){
	return{
		restrict: 'A',
		scope:{ngModel: '=ngModel'},
		link: function(scope,element,parentController){
			var listener = function(e){
				e.stopPropagation();
				e.preventDefault();
				var setScopeVal = function(val){
console.log(val); //<<=== this dumps base64 data to console
scope.ngModel=val;
				};
				var f = this.files[0];
				var reader = new FileReader();
				reader.onload = (function(f){
					return function(e){
setScopeVal(e.target.result); //<<=== this gives access to the base64 encoded filedata
					};
				})(f);
				reader.readAsDataURL(f);
			};
			element.bind('change',listener);
			}
		};
	}
);

/* Styles go here */