I have some content where I use ng-style, here is part of the template html:
<div ui-tree-handle data-nodrag
class="tree-node tree-node-content"
ng-click="toggle(this)"
ng-style={{breddeCSS}}>
the breddeCSS is defined in the controller here:
function setBreddeCSS(b) {
switch (b) {
case 0:
$scope.breddeCSS = {
"margin": "-1px",
};
break;
case 1:
$scope.breddeCSS = {
"margin": "5px",
};
break;
default:
$scope.breddeCSS = {
"margin": "10px",
};
}
}
The template gets the margin style, but only when the site is first loaded. If I change the $scope.bredde, it is only when the page is refreshed that I see the change!
I would like the page to change dynamically everytime $scope.bredde is updated. How can I do this?
ngStyle requires an expression itself not the resulf of its evaluation. Docs.
<div ui-tree-handle data-nodrag
class="tree-node tree-node-content"
ng-click="toggle(this)"
ng-style="breddeCSS">