为什么我的 leftsideBar 不起作用？有棱角的材料

Question

我想用棱角材料制作sidenav。

<div class="example-tabs-500-height elements-sidebar-example ">test1<!-- right sidebar -->


<section layout="row" flex>

    <md-sidenav class="md-sidenav-left" md-component-id="left"
                md-disable-backdrop md-whiteframe="4">

        <md-toolbar class="md-theme-indigo">
            <h1 class="md-toolbar-tools">Disabled Backdrop</h1>
        </md-toolbar>

        <md-content layout-margin>
            <p>
                This sidenav is not showing any backdrop, where users can click on it, to close the sidenav.
            </p>

        </md-content>

    </md-sidenav>

    <md-content flex layout-padding>

        <div layout="column" layout-align="top center">
            <p>
                Developers can also disable the backdrop of the sidenav.<br/>
                This will disable the functionality to click outside to close the sidenav.
            </p>

            <div>
                <md-button ng-click='toggleLeft("left")' class="md-raised">
                    Toggle Sidenavs
                </md-button>
            </div>

        </div>

    </md-content>

</section>

在控制器中：

$scope.toggleLeft = toggleLeft; // $scope.toggleRight = buildToggler('right');

    function toggleLeft(componentId) {
        console.log('toogle');
        return function() {
            $mdSidenav(componentId).toggle();
        }
    }

函数 toggleLeft 在控制台“toogle”中写入。

Answer 1

你为什么要返回一个函数？

function() {
    $mdSidenav(componentId).toggle();
}

应该只是：

function toggleLeft(componentId) {
    console.log('toogle');
    $mdSidenav(componentId).toggle();
}

更新

看看这个例子：http://codepen.io/anon/pen/pEJOzg