Javascript 重建角材料网站'；s侧导航

我喜欢在Angular Material网站上构建的sidenav。我想为我的网页实现一个类似的sidenav。我已经成功地创建了一个基本的Angular Material sidenav，但我很难弄清楚如何获得展开的菜单项，就像Angular Material网站上一样。提前感谢您的帮助
以下是我到目前为止的html：

<div class="tools-view inherit-height" data-ng-controller="AnalysisController">
    <div layout="column" layout-fill>
        <section layout="row" flex>
            <md-sidenav class="md-sidenav-left md-whiteframe-z2 left-sidenav" md-component-id="left" md-is-locked-open="$mdMedia('gt-lg')">
                <md-toolbar class="md-theme-indigo">
                    <h1 class="md-toolbar-tools"><span class="glyphicon glyphicon-briefcase"></span>&nbsp;&nbsp;Image Analysis Tools</h1>
                </md-toolbar>
                <md-content class="md-padding sidenav-content" ng-controller="LeftCtrl">
                    <ul class="tools-menu">
                        <li>

                        </li>
                    </ul>
                </md-content>
            </md-sidenav>
            <md-content flex class="md-padding">
                <div layout="column" layout-fill layout-align="center center">
                    <p>
                        The left sidenav will 'lock open' on a medium (>=960px wide) device.
                    </p>
                    <div>
                        <md-button ng-click="toggleLeft()" class="md-primary" hide-gt-md>
                            Toggle left
                        </md-button>
                    </div>
                </div>
            </md-content>
        </section>
    </div>
</div>

图像分析工具





左侧导航将在中等（>=960px宽）设备上“锁定打开”。

向左切换