CODEWITHSUNDEEP
angularjs
Kenn
Kenn

Reputation: 2769

why does ng-show seem to no longer know that the variable has been updated?

So I have a simple ng-show right.

 <div class="floatLeft" ng-show="loadingContactEdit">
       <img src="/Content/css/images/throbber_16x16.gif" />
 </div>

Then when the edit button is clicked I run the following code, there is no issue getting the img to show when I say $scope.loadingContactEdit = true but I can never get it to hide even though the callback seems fine and I can see that the first console log message is true and then the second is false - it's as iff somehow notification is not working after the callback? I am not sure what is wrong. 

$scope.openContactEditForm = function() {
    $scope.loadingContactEdit = true;
    ngDialog.open({
        template: '/Contact/CreateAngularModal/' + $scope.quickScreenDataContract.PersonId + '?caseId=' + $scope.quickScreenDataContract.CaseId,
        preCloseCallback: function () {
            hideThrobber();
        }
    });
};

var hideThrobber = function() {
    console.log("Hide loading message..." + $scope.loadingContactEdit);
    $scope.loadingContactEdit = false;
    console.log("Hide loading message..." + $scope.loadingContactEdit);
}

Upvotes: 0

Views: 18

Answers (1)

Arnaud Denoyelle
Arnaud Denoyelle

Reputation: 31263

You are making a call to an api outside of Angular. You should call $scope.$apply() in order to tell angular that the value has changed and that it must update the view : 

var hideThrobber = function() {
  console.log("Hide loading message..." + $scope.loadingContactEdit);
  $scope.$apply(function(){
    $scope.loadingContactEdit = false;
  )}
  console.log("Hide loading message..." + $scope.loadingContactEdit);
}

Upvotes: 1

Related Questions