AngularJS Example

for http://stepansuvorov.com/blog/

by Stepan Suvorov

HTML

<input type="file" ng-model="image" file-changed />
    {{image}}

JavaScript

var app = angular.module('foo', [])

app
.directive('fileChanged', function() {
    return {
      restrict: 'A',
      require: '?ngModel',
      link: function($scope, element, attrs, ngModel) {
        if (!ngModel) {
          return;
        }

        ngModel.$render = angular.noop;

        element.bind('change', function(event) {
          ngModel.$setViewValue(event.target.files[0]);
          $scope.$apply();
        });
      }
    };
  });