Угловые нг-стиль не применяется автоматически изменений при изменении его от контроллера

Question

у меня есть некоторое содержание, где я использую нг-стиль, здесь является часть шаблона HTML:

<div ui-tree-handle data-nodrag 
    class="tree-node tree-node-content" 
    ng-click="toggle(this)" 
    ng-style={{breddeCSS}}> 

в breddeCSS определяется в контроллер здесь:

 function setBreddeCSS(b) { 

      switch (b) { 

       case 0: 
        $scope.breddeCSS = { 
         "margin": "-1px", 
        }; 
        break; 

       case 1: 
        $scope.breddeCSS = { 
         "margin": "5px", 
        }; 
        break; 

       default: 
        $scope.breddeCSS = { 
         "margin": "10px", 
        }; 
      } 

     } 

Шаблон получает стиль поля, но только при первом загрузке сайта Если я изменяю $ scope.bredde, то только когда страница обновляется, я вижу изменение!

Я бы хотел, чтобы страница менялась динамически каждый раз, когда обновляется $ scope.bredde. Как я могу это сделать?

Answer 1

ngStyle требует само выражение, а не повторение его оценки. Docs.

<div ui-tree-handle data-nodrag 
    class="tree-node tree-node-content" 
    ng-click="toggle(this)" 
    ng-style="breddeCSS"> 

http://plnkr.co/edit/RxTte5njdS8GfTiD73LA?p=preview