角度2下拉子菜单

Question

如何在角度2中实现下拉子菜单？我有这段代码：

<button md-icon-button [mdMenuTriggerFor]="menu" class="topPosition color-md-icon">
  <md-icon>more_vert</md-icon>
</button>
<md-menu #menu="mdMenu">
  <button (click)="fi()" md-menu-item>
    <md-icon>cloud</md-icon>
    <span>1</span>
  </button>
  <button md-menu-item>
    <md-icon>cloud</md-icon>
    <span>2</span>
  </button>
  <button md-menu-item>
    <md-icon>cloud</md-icon>
    <span>3</span>
  </button>
  <md-divider></md-divider>
  <button md-menu-item>
    <md-icon>perm_data_setting</md-icon>
    <span>4</span>
  </button>
</md-menu>

也许添加一些自定义功能？或者是其他东西？我看到angularjs（https://material.angularjs.org/latest/demo/menuBar）的这个材质子菜单，比如File - New，然后打开新的子菜单。