I have an ng-class
attribute (that I didn't write on my own). It is bound to a string variable in the controller . It looks like: <some-tag ng-class="'indicator_' + $ctrl.stringValue"></some-tag>
.
When the window first load - it contain the correct data, but after the string is updated in the controller - the value in the class
attribute only updates after I'm clicking the element (the click will open a list, but I don't think it's relevant).
I've read that the first thing to check in these cases, is that the code is surrounded by a $scope.$apply
. It is, cause when I try to add it - I get an error saying "$digest already in progress".
Looking for $ctrl
and ng-class
info, I read the AngularJS component doc and this site, that gave me some basic background about these subjects.
The thing is, I couldn't find any examples of ng-class
with $ctrl
. Maybe it's irrelevant, but maybe not :)
Example for an irrelevant question I found in the subject is: Angular ngClass is not updating my classes even though my condition change as expected. In general, most of the examples I found include curly brackets, which I don't think are relevant in this case, since I'm binding a string (maybe I'm mistaking about it :) ).
I suspect it probably didn't bind it correctly, I just don't know why.
Edit:
After continuing to search the subject, I'm no longer sure it's related to the ng-class
(so I edited the title as well). It looks more like a refresh problem.
I'm puzzled as to why the page doesn't refresh, since everywhere I read - they say that the Angular should call the digest function on its own, and I should not interfere.
Edit2:
I'm working with typeScript
, and the stringValue
is updated via an event from a service. But the string does update - so I'm not sure it is a relevant information to understand the problem, but worth mentioning :)
Problem solved!! :D
All I had to do, is to add $timeout(0)
after updating the string in the controller!
The explanation: it was a digest problem, and the reason I couldn't use $scope.$apply()
, is because I was trying to do it directly. I needed to do a safe apply, which means - first make sure there's no digest on that scope, and then run apply.
Turns out that an easy way to do it, is to use $timeout(0)
.