Question

我使用

<md-sidenav md-component-id="leftNav" md-is-open="vm.isOpen"
            md-is-locked-open="vm.isPinned" ... >
    <i class="fa fa-bars float-right" ng-click="vm.toggleNav()"></i>
    ...
</md-sidenav>

使用控制器中的toggleNave方法设置值

class MyController {
    constructor($mdSideNav) {
        this.mdSideNav = mdSideNav;
        this.isPinned = false;
        this.isOpen = false;
    }

    toggleNav = (navId) => {
        this.$mdSideNav(navId).toggle().then( () => {
            this.isPinned = this.isOpen;
        }
    }
}

但是这会导致屏幕在打开和关闭时闪烁，这似乎不是打开sideNav的最好方法。

希望打开/关闭中殿拨动开关，但在关闭之前保持开放状态。

如果我使用md-is-locked =＆＃34; $ media（＆＃39;＆＃39;）＆＃34;然后sideNav锁定打开，永远不会关闭，直到窗口收缩到媒体大小以下。这不是我想要的。

如果我根本不使用md-is-locked，那么当你点击它时，sideNav就会关闭，但我希望它保持开放状态！直到我想关闭它。

任何人都知道怎么做？

由于

BTW：我使用的是ES6，因此有类和箭头功能。： - ）

Answer 1

通过查看文档，我认为您不需要使用isPinned和isOpen变量，因为它看起来像toggle函数处理它。

因此，这个

toggleNav = (navId) => {
    this.$mdSideNav(navId).toggle().then( () => {
        this.isPinned = this.isOpen;
    }
}

会来

toggleNav = (navId) => {
    this.$mdSideNav(navId).toggle();
}

要完成这项工作，您需要传递sideNav的ID

所以这个

<i class="fa fa-bars float-right" ng-click="vm.toggleNav()"></i>

会变成

<i class="fa fa-bars float-right" ng-click="vm.toggleNav('leftNav')"></i>

最后，值得检查您正在使用的Material Design的版本，在不使用＆gt; 0.8版本时似乎存在相当多的问题。

请参阅文档Side Nav Material Design

中的右侧导航示例

如何在Angular-Material Design中打开sideNav

1 个答案: