Within a div, I am utilizing
ng-class="{minifyClass: minifyCheck}"In the controller, I monitor changes in two parameters - $window.outerHeight and
$('#eventModal > .modal-dialog').height()minifyChange() function to execute certain tasks.
function minifyChange(){
if( $('#eventModal > .modal-dialog').height()+75 < $window.outerHeight ){
$scope.minifyCheck = true;
}else{
$scope.minifyCheck = false;
}
//$scope.$digest();
}
$scope.$watch(function () {
return $('#eventModal > .modal-dialog').height()
},function(){ return minifyChange() }, true)
$scope.$watch(function () {
return $window.outerHeight;
},function(){ return minifyChange() }, true)
If I leave out the $scope.$digest(), I must "wait" until the next $scope.$digest() or $scope.$apply() occurs for the addition or removal of minifyClass based on the value of minifyCheck. This waiting period can lead to suboptimal user experience.
However, omitting the $scope.$digest() will result in an error indicating that the $digest is already in progress:
Error: [$rootScope:inprog] http://docs.angularjs.org/error/$rootScope:inprog?p0=$digest
My Angular code is intricate, making it challenging to identify the ongoing digest. Here is the complete error message:
Error: [$rootScope:inprog] http://errors.angularjs.org/undefined/$rootScope/inprog?p0=%24digest
at Error (<anonymous>)
at http://localhost:8000/static/angular/angular.min.js:6:453
at h (http://localhost:8000/static/angular/angular.min.js:93:109)
at g.$digest (http://localhost:8000/static/angular/angular.min.js:96:74)
at minifyChange (http://localhost:8000/e=52a1a39345dc83b057c17dc1#v1:444:12)
at Object.fn (http://localhost:8000/e=52a1a39345dc83b057c17dc1#v1:450:22)
at g.$digest (http://localhost:8000/static/angular/angular.min.js:96:367)
at g.$apply (http://localhost:8000/static/angular/angular.min.js:99:100)
at http://localhost:8000/static/angular/angular.min.js:17:320
at Object.d [as invoke] (http://localhost:8000/static/angular/angular.min.js:30:21) angular.js:8058
(anonymous function) angular.js:8058
(anonymous function) angular.js:5730
g.$digest angular.js:9096
g.$apply angular.js:9363
(anonymous function) angular.js:1127
d angular.js:3146
Sb.c angular.js:1125
Sb angular.js:1140
Mc angular.js:1091
(anonymous function) angular.js:17902
l jquery-2.0.3.js:2913
c.fireWith jquery-2.0.3.js:3025
x.extend.ready jquery-2.0.3.js:398
S jquery-2.0.3.js:398
My query: Is there a way to update the class without triggering this error? Are there alternative Angular functions that could serve this purpose? Alternatively, if avoiding the use of $digest is impossible, how can I pinpoint and debug the concurrent digest process?