2015-12-31 44 views
0

我試圖阻止md-menu從收盤md-menu-item的點擊。我已經通過角度材料的menuServiceProvider中的以下修復來實現它。推薦快速的解決方法,以防止MD-菜單從收盤MD-菜單項的點擊

https://github.com/angular/material/blob/master/src/components/menu/js/menuServiceProvider.js更改線路286將允許這一點。

if (!target.hasAttribute('disabled') && !target.hasAttribute('md-menu-disable-close') && 
    (!closestMenu || closestMenu == opts.parent[0])) { close(); } 

但尋找替代方案來做到這一點。

回答

0

對於這個問題,我得到了最好的解決方法,因爲md-menu組件從具有以下屬性之一的元素中查找點擊['ng-click','ng-href','ui-sref'] ,我們可以創建自己的NG-點擊的版本,並使用了MD-菜單內的任何點擊事件,就像這樣:

app.directive('myClick', function ($parse, $rootScope) { 
return { 
    restrict: 'A', 
    compile: function ($element, attrs) { 
     var fn = $parse(attrs.myClick, null, true); 
     return function myClick(scope, element) { 
      element.on('click', function (event) { 
       var callback = function() { 
        fn(scope, { $event: event }); 
       }; 
       scope.$apply(callback); 
      }) 
     } 
    } 
} 
}) 

...在HTML ...

<md-menu> 
<md-button>Open Menu</md-button> 
<md-menu-content> 
    <md-button my-click="doSomething()">Click me without closing the menu</button> 
</md-menu-content> 
</md-menu> 
0

我也面臨着同樣的問題 - 當點擊事件觸發,我將我的菜單內容的內部MD-防止菜單關閉=「MD-防止菜單關閉」裏曾經我用NG點擊菜單項關閉,ui-sref等這個問題解決了。下面

<md-menu> 
    <md-button class="md-icon-button"> 
    <i class="material-icons md-notification-badge" >notifications</i> 
    </md-button> 
    <md-menu-content class="alert-menu" width="6" > 
     <md-menu-item ng-repeat="item in $ctrl.myAlertsNotifications"> 
     <div><i class="material-icons">{{item.icon}}</i></div> 
     <i class="material-icons" ng-click="$ctrl.deleteAlerts(item.MessageNumber);" md-prevent-menu-close="md-prevent-menu-close">delete</i> 
     </md-menu-item> 
    </md-menu-content> 
    </md-menu> 
示例代碼段