javascript - 除了某些元素，Angular JS 禁用触摸滚动

Question

我正在构建一个部署在 iPad 上的 Web 应用程序，我们正在寻找一种方法来禁用整个 View 的滚动，某些 div 除外。理想情况下，能够将 scroll 类或其他东西应用到 div 并且只允许 scroll 类滚动会很棒。

这里的 Angular 方法应该是什么？我在网上看到了各种 JQuery 和纯 Javascript 方法，但它们看起来都很困惑，而且不一定万无一失。

Answer 1

一个选项是确定设备窗口的高度(允许您使用任何设备/pc)并以 ng-style 设置您的 div 的最大高度。

$scope.windowHeight = $window.innerHeight; //might need to subtract 30 pixels for side scrollbar if needed.
$scope.innerDivHeight = Math.ceil($scope.windowHeight / 3) //Whatever scale you want your inner divs to be.

然后

<div class="container" ng-style="{'max-height': windowHeight+'px', 'overflow':'none'}">
    <div class="innerDiv" ng-style="{'max-height': innerDivHeight+'px', 'overflow':'auto'}">
    </div>
</div>

您可能不得不对它进行一些改动，但这样一来它就可以在台式机和 iPad 上正常工作，而无需引入特定于平台的要求。注意 overflow none 表示不滚动，而 auto 表示是，如果超出高度则在该 div 内滚动。

就像我说的，这可能不是您要找的东西，但您不需要任何额外的复杂性来做到这一点。