Question

HTML：

 <ons-template id="tou.html">
   <ons-page modifier="tou" ng-controller="tou">
       <ons-toolbar class="tou_toolbar">
           <div class="center tou_header_title">Terms of Use</div>
       </ons-toolbar>

       <ons-scroller style="width: 100%;" scroll-height>
           <ng-include src="'lib/templates/terms_of_use.html'"></ng-include>
       </ons-scroller>
   </ons-page>
 </ons-template>

JS：

var app = angular.module('app', ['onsen']);

app.directive('scrollHeight',function(){
    return {
        link: function(scope,element,attr){
            // newHeight needs to be the window-height (minus) ons-toolbar height
            var newHeight = 400;
            element.css('height', newHeight);
        }
    }
});

我想要实现的是通过计算可视窗口高度并减去工具栏高度来动态调整内容窗口的滚动高度。我有点失去了如何在不使用任何Jquery的情况下以适当的AngularJS方式执行此操作，或者至少以正确的方式使用它。

如何获得完整的可视窗口高度？

如何获取scrollHeight指令中工具栏元素的高度？

其次 - 这适用于移动应用，因此视口不会动态更改，但我仍需要在应用启动时计算可滚动高度。

非常感谢任何正确方向的帮助或指导。

PS - html代码段嵌套在较大的<ng-app="app">

中

AngularJS使用外部元素高度和窗口高度计算指令中的元素高度

0 个答案: