Angular material Md Sidenav。当sidenav打开时，如何将主要内容推到右侧？

所以我通过建立一个投资组合SPA来学习，我真的很想使用md sidenav，到目前为止它还可以工作，但它显示在我的内容之上，我希望它在打开时将我的内容推到正确的位置

var app = angular.module('myApp', ['ngMaterial']);
app.controller('MyController', function($scope, $mdSidenav) {
  $scope.openLeftMenu = function() {
    $mdSidenav('left').toggle();
  };
});

HTML

使用属性

md在
md sidenav
元素上锁定打开

但是，您必须更改如何打开sidenav的逻辑。我可以通过将
md is locked open
绑定到model state属性，然后在单击事件时自己切换它来实现：

<md-sidenav md-is-locked-open="isSideNavOpen">...</md-sidenav>

$scope.openLeftMenu = function() {
  $scope.isSideNavOpen = !$scope.isSideNavOpen;
};

。。。
$scope.openLeftMenu=函数（）{
$scope.isSideNavOpen=！$scope.isSideNavOpen；
};
用于新的角度材质版本

在您的
中添加
mode=“push”



请参阅：

<md-sidenav md-is-locked-open="isSideNavOpen">...</md-sidenav>

$scope.openLeftMenu = function() {
  $scope.isSideNavOpen = !$scope.isSideNavOpen;
};

<md-sidenav mode="push">

</md-sidenav>