2

ここで非常に奇妙な状況になりました。

最初に、簡単なディレクティブを書きました。

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 では、リーフ アイコンのサイズはデフォルト サイズです。
(結果の画像を投稿していないことをお詫びします。私はここでは非常に初心者であり、評判はありません)

どうやってそれが起こったのですか?そして、非常に重要なことですが、どうすれば解決できますか?

4

1 に答える 1

8

ng-style構文が混乱しています。

のオブジェクトの各プロパティの値はng-styleAngularJS 式です。つまり、スコープ プロパティを直接参照できます。

に変更しng-style="{'font-size': parentSize.width + 'px'}"ます。

于 2014-12-04T03:56:44.640 に答える