angular scope changes with file input type

Question

I am calling a preview method as follows

<span class="error-message">{{FilesNotSelected}}</span>

<input type="file" onchange="angular.element(this).scope().previewFile('firstLevel')">

In my script I am changing a scope variable as follows

 $scope.previewFile = function (uploadType) {
      $scope.FilesNotSelected = "Selected";
 }

I am unable to get the changed value to be displayed in the UI. Can someone please help me find the issues. It seems scope get changed.

@hadiJZ in that case previewFile method is not being called. — Prashant, Mar 01 '16 at 12:31
try this http://stackoverflow.com/questions/17922557/angularjs-how-to-check-for-changes-in-file-input-fields — Hadi J, Mar 01 '16 at 12:35

score 0 · Accepted Answer · answered Mar 02 '16 at 11:27

The problem was with scope. Somehow the scope get changed and the updated value is not available. $scope.$apply(function (scope){}) helped solve this issue.

$scope.previewFile = function (uploadType) {
    $scope.$apply(function (scope) {
                      .
                      .
                      .
        reader.onloadend = function () {
            $scope.$apply(function (scope) {
                scope.FilesNotSelected = false;
                      .
                      .
                      .
                }
            }
        }
    }
}

angular scope changes with file input type

1 Answers1