JSFiddle - React, Tailwind, and code Playground

by Varun Krishna P

HTML

<div
    data-ng-app="angularjstutorial.blogspot.com/2012/12/angularjs-input-file-directive.html"
    data-ng-controller="MainController">
    <input type="file" data-file="param.file"/>
    <div>param.file: {{param.file}}</div>            
</div>

JavaScript

var module = angular.module('angularjstutorial.blogspot.com/2012/12/angularjs-input-file-directive.html', []);
module.directive('file', function(){
    return {
        scope: {
            file: '='
        },
        link: function(scope, el, attrs){
            el.bind('change', function(event){
                var files = event.target.files;
                var file = files[0];
                scope.file = file ? file.name : undefined;
                scope.$apply();
            });
        }
    };
});
function MainController($scope){
    $scope.param = {};
}