指令中的角度範圍的變量不會以ng樣式同步

Question

我在這裏遇到了一個非常奇怪的情況。

起初，我寫了一個簡單的指令。

mublABase.directive('parentSize', function() { 
    return { 
     link : function(scope, elem, attrs) { 
      scope.parentSize = { 
       width : elem.parent().width(), 
       height : elem.parent().height() 
      } 
     } 
    } 
}); 

這是我簡單的html代碼

<input type="text" ng-model="parentSize.width"> //for test No.1 
<div parent-size class="no-border"> 
    {{parentSize.width}} //for test No.2 
    <span class="glyphicon glyphicon-leaf" ng-style="{'font-size':'{{parentSize.width}}px'}"></span> //this is the problem No.3 
</div> 

並導致損壞。第一個輸入和第二個文本說寬度是285.但是在第三個，葉子圖標的大小隻是默認大小。
（對不起，沒有發佈結果圖片，我很喜歡這裏，我沒有任何聲望）

它怎麼會發生？更重要的是，我該如何解決它？

Answer 1

你剛剛得到了ng-style語法混淆。

ng-style中對象的每個屬性的值都是AngularJS表達式，這意味着您可以直接引用範圍屬性。

將其更改爲ng-style="{'font-size': parentSize.width + 'px'}"。