在 AngularJS 指令中获取height
元素时,我看到的值好像它出现在relative
父级的范围内。如何height
根据显示元素的真实性获取元素的width
属性?
我有以下 HTML,它将我的指令模板放入 adiv
中width: 200px
:
<div style="width:200px">
<inline-input-popover value="foo" width="350">
<p>Type string to insert into target. Here's some extra text to add length to the paragraph.</p>
</inline-input-popover>
</div>
这样做是为了在该宽度内显示指令内的静态元素,但也有一个动态弹出框,我可以为其赋予不同的宽度。这是我的指令模板:
<div class="inline-input-popover">
<input class="placeholder-input" type="text" ng-model="value" ng-focus="hasFocus=!hasFocus" />
<div class="inline-popover" outside-click="closePopover()" ng-click="keepFocus()" ng-show="hasFocus" ng-style="{width:{{width}}+'px'}">
<div class="inline-header" ng-transclude></div>
<input class="inline-input" type="text" ng-model="value" />
<button ng-click="closePopover()">Done</button>
</div>
</div>
我有一个ng-style
被应用于absolute
定位的弹出框,根据指令中传入的变量调整元素的大小。
但是当我检查指令部分中inline-header
元素的高度时:link
var inlineInput = elem[0].getElementsByClassName('inline-input')[0];
console.log(inlineHeader.height());
...我得到元素的高度,就像应用到它之前一样。ng-style
是否可以根据应用的样式确定正确的元素高度ng-style
?