角度范围的变量来自指令而不是以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>

结果被打破了.No.1输入和No.2文本表示宽度为285.但是在No.3,叶子图标的大小只是默认大小.
(抱歉没有发布结果图片.我在这里非常诺布,我没有任何声誉)

怎么会发生？更重要的是,我该如何解决？

Answer 1

你的ng-style语法很混乱.

对象的每个属性的值ng-style是AngularJS表达式,这意味着您可以直接引用范围属性.

将其更改为ng-style="{'font-size': parentSize.width + 'px'}".