Как изменить скоростной диск md fab для показа по щелчку? Угловой материал

Question

Как изменить md-fab-speed-dial, чтобы открыть и активировать меню быстрого набора с помощью щелчка, а не зависания. И как я могу удалить этот пробел (на картинке)?

Вот вид

md-fab-speed-dial md-open="demo.isOpen" md-direction="{{ demo.selectedDirection }}" ng-class="demo.selectedMode" 
    md-fab-trigger.actions-icon-menu 
     md-button.md-icon-button aria-label="menu" 
     md-icon.more-icon md-svg-src="#{asset_path('icons/more_icon.svg')}" 
    md-fab-actions.actions-menu 
     section.actions_icons layout="row" layout-align="center center" 
     md-button.md-primary aria-label="edit icon" 
      md-icon md-svg-src="#{asset_path('actions_icons/edit.svg')}" 
     md-button.md-primary aria-label="remove icon" 
      md-icon md-svg-src="#{asset_path('actions_icons/remove.svg')}" 
     md-button.md-primary aria-label="download icon" 
      md-icon md-svg-src="#{asset_path('actions_icons/download.svg')}" 
     md-button.md-primary aria-label="print icon" 
      md-icon md-svg-src="#{asset_path('actions_icons/print.svg')}" 
     md-button.md-primary aria-label="mail icon" 
      md-icon md-svg-src="#{asset_path('actions_icons/mail.svg')}" 

Контроллер:

function ($scope, $mdSidenav, $mdUtil, $location, Invoice) { 

     $scope.demo = { 
     topDirections: ['left', 'up'], 
     bottomDirections: ['down', 'right'], 

     isOpen: false, 

     availableModes: ['md-fling', 'md-scale'], 
     selectedMode: 'md-fling', 

     availableDirections: ['up', 'down', 'left', 'right'], 
     selectedDirection: 'left' 
     }; 
    }]); 

Answer 1

ли md fab dial открыта в зависимости от модели 'demo.isOpen'. Вы можете решить использовать ng-mouseenter или ng-click.

Answer 2

Просто установите md-trigger в click

Например:

<md-fab-speed-dial md-trigger="click" md-direction="down" class="md-scale md-fab-top-right"></<md-fab-speed-dial>