我正在创建一个web应用程序,其中我有一个输入字段

< input type =“file”ng-model =“getfilename”/>

和一个按钮

< button ng-click =“clickfordetails()”>点击此处！< / button>

和段落标记< P> {{file}}< / p>
当用户在输入字段中输入文件后单击按钮时,他应该在{{file}}中获取文件名

这是我的控制器

$scope.clickfordetails=function() {
    $scope.file=$scope.getfilename;
}

但是当我编辑控制器时,我无法获取文件名

$scope.clickfordetails=function() {
    console.log($scope.getfilename);
}

我的控制台(谷歌浏览器)中的值是未定义的

我该怎么做？

解决方法:

使用以下指令

directive('customFileInput', [function () {
    return {
        link: function (scope, element, attrs) {
            element.on('change', function  (evt) {
                var files = evt.target.files;
                scope.filename=files[0].name
            });
        }
    }
}]);