problems with ng-show angularjs

Question

ng-show did not work clearly for me in angular js. this is the "loading" div:

<div class="loader" ng-show="vm.loadingNotifications" ng-cloak>loading...</div>

and that's the API call in the controller:

function getNotifications(userId) {
   if (vm.generalNotifications.length > 0) {
       vm.loadingNotifications = false;
   } else {
       vm.loadingNotifications = true;
       $.ajax({
       type: 'GET',
       url: AppConfig.apiUrl + 'Notifications/GetAllNotificationsByUserId?userId=' + userId,
       success: function (notifications) {
           if (notifications) {
               $("#all-not").addClass("active");
               if (notifications.length > 0) {
                   let tempNotifications = [];
                   for (let j = 0; j < notifications.length; j++) {
                       let element = notifications[j];
                       let title = getSpecificConst(element.NotificationTitle)
                       element.NotificationTitle = title;
                       let text = getSpecificConst(element.NotificationText)
                       element.NotificationText = text;
                       tempNotifications.push(element);
                    }
                    vm.generalNotifications = sortArray(tempNotifications);
                    vm.displayedNotifications = sortArray(tempNotifications);
                    vm.isEmptyNotifications = false;
                }
                else {
                     vm.isEmptyNotifications = true;
                 }
            } else {
                vm.isEmptyNotifications = true;
            }
            vm.loadingNotifications = false;
         }
      });
   }
}

the VM loading is updating clearly, but the ng-show stack always in true.

Answer 1

you need to use AngularJS Scope on the controller.

$scope.vm = {
generalNotifications:[],
loadingNotifications: false,
....
};

function getNotifications(userId) {
   if ($scope.vm.generalNotifications.length > 0) {
       $scope.vm.loadingNotifications = false;
   } else {
       $scope.vm.loadingNotifications = true;
.....
}