Anglejs with material design md-menu-item垂直問題

Question

私はangularjsの資料のデモに従ってメニューを作成しています。デモメニューでは、動的なので、垂直に来ています。しかし、私は手動で作成する場合、同じメニューは、それは水平を作成しています。

私はそれ縦メニュー行うことができますどのように私のいくつかのコード

<md-toolbar> 
        <div class="md-toolbar-tools"> 
         <md-menu md-position-mode="target-left bottom" md-offset="-22 6"> 
          <md-button aria-label="Plan & Book" ng-click="$mdOpenMenu($event)"> 
           Parent Item 1 
          </md-button> 
          <md-menu-content width="4"> 
           <md-menu-item> 
            <md-button>Item 1</md-button> 
            <md-button>Item 2</md-button> 
            <md-button>Item 3</md-button> 
           </md-menu-item> 
          </md-menu-content> 
         </md-menu> 
         <md-menu> 
          <md-button aria-label="Manage A Booking" ng-click="$mdOpenMenu($event)"> 
           Parent Item 2 
          </md-button> 
          <md-menu-content class="dropdown"> 
          </md-menu-content> 
         </md-menu> 
        </div> 
       </md-toolbar> 

私の完全なコードペン http://codepen.io/milindsaraswala/pen/dXvVOa

!!

Answer 1

あなたは<md-menu-item>を分離する必要があります。

<md-menu-item> 
    <md-button>Item 1</md-button> 
</md-menu-item> 
<md-menu-item> 
    <md-button>Item 2</md-button> 
</md-menu-item> 
<md-menu-item> 
    <md-button>Item 3</md-button> 
</md-menu-item> 

あなたのコードは更新：http://codepen.io/anon/pen/beqaqZ