选择文件输入ng-change永远不会触发

时间:2017-07-24 09:02:19

标签: javascript angularjs

因此文件输入打开正常,我可以选择一个文件。我现在也知道文件上传工作并且它绑定了一个文件。但是ng-change事件永远不会被触发。

<img class="profile-pic" ng-click="addHeaderImage()" ng-src="{{applyform.UseProfilePic}}"/>
<input type="file" ng-change="uploadHeader()" style="display: none" id="headerinput" ngf-select ng-model="file" ngf-multiple="false"/>

$scope.addHeaderImage = function () {
    document.getElementById("headerinput").click();
}

$scope.uploadHeader = function () {
    //$scope.loading = true;
    var file = document.getElementById("headerinput").files[0];
    var reader = new FileReader();
    console.log("TJAABAB");
    reader.addEventListener("load",
        function () {
            //item.Image = reader.result;
            console.log("UPLOAD");
            console.log(reader.result);
            $scope.$apply();
            //$scope.updateQuoteHeader(item);
            //$scope.loading = false;
        },
        false);
    if (file) {
        reader.readAsDataURL(file);
    }
}

所以当我选择文件时,永远不会触发函数上传标题。那是为什么?

1 个答案:

答案 0 :(得分:2)

尝试onchange:

,而不是ng-change
<input type="file" onchange="angular.element(this).scope().uploadHeader()" style="display: none" id="headerinput" ngf-select ng-model="file" ngf-multiple="false"/>