保持默认打开md-sidenav

-1

我已创建md-sidenav。我想在默认情况下保持sidenav处于打开状态，但我仍然希望sidenav显示在页面上方，我希望能够关闭sidenav - 因此我不想使用md-is-locked-open表达式。任何想法我可以做到这一点？保持默认打开md-sidenav

HTML代码：

<md-button class="md-icon-button hamburger" aria-label="More" ng-click="openLeftMenu()" style="height: auto;"> 
      <md-icon md-svg-icon="images/menu.svg"></md-icon> 

     </md-button> 

<md-sidenav layout="column" class="md-sidenav-left md-whiteframe-z2 menuside" md-component-id="left"> 

    <div class="navheader" layout="row" layout-align="space-between center"> 

     <!--show location--> 
     <md-button ui-sref="map" ng-click="openLeftMenu()" md-ink-ripple="false" class="yourlocation" layout="row" layout-align="start center" aria-label="Current-location"> 
      <p class="locationtext">{{currentLocation}}</p> 
     </md-button> 


     <!--close menu--> 
     <button class="hambugerclose" ng-click="openLeftMenu()"> 
      <i class="material-icons">clear</i> 
     </button> 

    </div> 

    <!--MOBILE MENU GRID--> 
    <div layout="row" layout-align="center center" class="jumbowrapper2" layout-wrap> 
     <div ng-repeat="navitem in navitems" class="navitemwrap" flex="33"> 
      <md-button md-ink-ripple="false" layout="column" layout-align="center center" ui-sref="{{navitem.path}}" href="{{navitem.link}}" ng-click="openLeftMenu()" class="itembutton"> 
       <div class="iconoutline" layout="column" layout-align="center center"> 
        <md-icon class="itemicon" md-svg-src="{{navitem.icon}}"></md-icon> 
       </div> 
       <p class="itemtext2" translate>{{navitem.title}}</p> 
      </md-button> 
     </div> 
    </div> 

</md-sidenav>

JS代码：

$scope.openLeftMenu = function() { 
$mdSidenav('left').toggle(); 
};

谢谢！

来源

2016-06-08 andrea

md-is-locked-open设置为等于逻辑值。我会使用它，并在我的控制器上有一个名为KeepSideBarOpen的属性，并且有一个按钮用于在单击时将此属性的值设置为false。（我可能会使用自定义控制器的侧面导航）。

function sideNavController() { 
    var vm = this; 
    vm.closeSideNav = closeSideNav; 
    vm.sideNavOpen = true; 

    function closeSideNav() { 
     vm.sideNavOpen = false 
    } 

}

<md-side-nav md-is-locked-open="ctrl.sideNavOpen">...</md-side-nav>

然后只要把你身边的资产净值（或其他地方）调用closeSideNav

来源

2016-06-08 20:50:42

通过“默认”我假设你的意思是在初始页面加载开放中的按钮。我做到了这一点通过使sidenav切换功能，就像你的...

$scope.openLeftMenu = function() { 
    $mdSidenav('left').toggle(); 
};

然后我把这个功能时，该文件已准备就绪...

angular.element(document).ready(function() { 
    $scope.openLeftMenu() 
});

这将使sidenav仍然很好地覆盖页面。

来源

2016-10-21 19:35:45 btathalon

我使用md-is-open作为下面的代码，它工作正常。

<md-sidenav md-is-open="true"

来源

2017-02-16 13:56:27

保持默认打开md-sidenav

回答

相关问题