在ng-view中禁用弹性滚动,但不要在ng-include的子视图中禁用

Disable elastic scroll in the ng-view, but not in the subview of ng-include

本文关键字:ng-include 视图 滚动 ng-view      更新时间:2023-09-26

我正在用angularjs开发一个web应用程序,有2级导航:

第一级:主导航使用ng-view。

第二层:使用ng-include的顶部和底部栏的子视图导航。

我在另一个问题中发布了更多细节:使用ng-include进行历史返回导航

当我在iphone上使用这个应用程序时,我在主视图和局部视图中都有弹性滚动。如何在主视图中禁用弹性行为,而不是在ng-include的局部视图中禁用?

我尝试使用下一个代码,但它禁用了两个视图。

document.addEventListener('touchmove',  function(e) {
    e.preventDefault();
    },
false
);

提前感谢!

如果你没有使用像isroll这样的库来滚动,你应该能够通过使用CSS和重新排列你的HTML来解决这个问题。

据我所知,你已经使用你的n -view作为一种容器元素,并在它的头,页脚和内容元素。

假设这是正确的,试着给容器元素的位置:fixed;将上,右,下,左都设为0。设置溢出为隐藏

也给content元素一个固定的位置,但是top = header的高度,bottom = footer的高度。然后给它一个overflow-y: scroll;

当然,这取决于你的页眉和页脚都是静态高度

我正在使用phonegap…所以我终于在config.xml中使用这个设置解决了我的问题:

 <preference name="webviewbounce" value="false" />

更多信息请访问:https://build.phonegap.com/docs/config-xml