Question

在我的项目中，我必须在height: 100%和<html>标记上设置<body>以制作中心元素，并使<md-sidenav>超过整页高度。

这会以某种方式破坏<md-autoselect>指令。在我的情况下，我有很多自动选择彼此。一旦我点击其中一个较低的页面，整个页面就会变白。这是由disableBodyScroll中的$mdUtils - 方法引起的，当自动选择，sidenavs等被打开时，它会被调用。

主要问题似乎是body.scrollHeight在我们的案例中与body.clientHeight相同。

$mdUtils.disableBodyScroll代码：

var clientWidth = body.clientWidth;
if (body.scrollHeight > body.clientHeight + 1) {
    applyStyles(body, {
        position: 'fixed',
        width: '100%',
        top: -scrollOffset + 'px'
    });

    applyStyles(htmlNode, {
        overflowY: 'scroll'
    });

 if (body.clientWidth < clientWidth) applyStyles(body, {overflow: 'hidden'});
}

这是由100％的高度引起的。从body和html标签中删除height属性可以解决autoselects的问题。但是，如果我们删除高度，小于100％的页面会显示错误的sidenav行为（sidenav只与页面一样高）。我们通过猴子修补$mdUtils.disableBodyScroll暂时解决了这个问题。我们换了 if (body.clientWidth < clientWidth) applyStyles(body, {overflow: 'hidden'}); 同 applyStyles(body, {'overflow': 'visible'});

很难为这个例子创建一个plnkr，因为结构非常复杂，一旦我尝试简化代码就不会出现问题。有没有人遇到过这个问题？

同时检查AngularJS Material GitHub页面上的问题： https://github.com/angular/material/issues/7158

`height：100％`和`<md-autoselect>`windows

0 个答案: