Javascript 材质设计：更改整个选项卡按钮的选择操作，而不仅仅是标签

我试图通过单击md tabs元素的最后一个选项卡来显示菜单。如果单击选项卡标签，我可以显示菜单，但如果单击选项卡的空白区域，它的行为与往常一样，显示关联的选项卡

如何将标签行为扩展到整个选项卡

这是一些代码

<md-tabs class="stretch-height" flex md-selected="mbpSelectedIndex" md-border-bottom
   md-dynamic-height>
   <md-tab ng-repeat="tab in mbpTabs" md-on-select="onTabSelected(tab)">
      <md-menu context-menu>
         <div flex class="mbpTable" ng-right-click="$mdOpenContextMenu($event)">{{tab.title}}</div>
         <md-menu-content>
            <md-menu-item >
               <md-button  ng-click="showDeleteTabDialog($index, tab.title)" ng-disabled="mbpTabs.length<=1">Delete</md-button>
            </md-menu-item>
            <md-menu-item >
               <md-button  ng-click="renameTab($index, tab.title)">Rename</md-button>
            </md-menu-item>
            <md-menu-item >
               <md-button  ng-click="createTab()">New Tab</md-button>
            </md-menu-item>
            <md-menu-item ng-controller="watchlistsController">
               <md-button  ng-click="showWatchLists()">Create from Wathclist...</md-button>
            </md-menu-item>
         </md-menu-content>
      </md-menu>
      <md-tab-body>
         <div ag-grid="tab.mbpTable.table" class="ag-mbp mbpTable" id="mbpPanel"></div>
      </md-tab-body>
   <!-- this is the intersting tab-->
   </md-tab>
   <md-tab md-on-select="return">
      <md-menu>
         <div flex class="mbpTable" ng-click="$mdOpenMenu($event)">+</div>
         <md-menu-content>
            <md-menu-item ng-repeat ="tab in mbpTabs">
               <md-checkbox aria-label="{{tab.title}}">{{tab.title}}</md-checkbox>
            </md-menu-item>
            <md-menu-divider></md-menu-divider>
            <md-menu-item >
               <md-button  ng-click="createTab()">Create Custom Tab</md-button>
            </md-menu-item>
         </md-menu-content>
      </md-menu>
   </md-tab>
</md-tabs>

{{tab.title}}
删除
改名
新标签页
从Wathclist创建。。。
+
{{tab.title}}
创建自定义选项卡

我是这样摆脱的：

我在CSS中添加了以下内容：

md-tab-item:last-of-type{
   padding:0!important;
   width:40px;
}

---

最后一个tab按钮没有填充，整个tab按钮可以在不切换tab的情况下按下。固定宽度与标签只是一个“+”的事实有关，因此它对于自动宽度来说太小。

Move ng click=“$mdOpenMenu（$event）”从div移动到父元素。继续向上移动，直到达到所需的效果。@AmirTalic不起作用，那么您可能有一些其他事件连接到父元素，该元素正在覆盖ng Clicking。我知道很难覆盖md选项卡的默认行为，因为“有一些事件连接到”，但我正在寻找一种方法来克服它…您没有发布多少代码来帮助我们，但只需查看您的HTML，用

ng click=“$mdOpenMenu（$event）”

替换select上的

md

，就可以了。。。如果您可以将代码发布到JSFIDLE上，那就太好了。