点击后 FAB 操作是否可能保持打开状态？

Question

我正在尝试弄清楚这是否有可能。

概念是 FAB 操作需要在点击后保持打开状态。

他们需要的是我想要一个带有动作的经典 FAB angular material FAB 按钮。因此，每个将被单击的操作按钮都会在其旁边打开一个弹出窗口以执行某些操作，比方说一个简单的输入。

我这样做了，但是当我点击操作按钮时，操作按钮和弹出框都消失了。

<md-fab-speed-dial md-trigger="click" md-direction="down" md-open="fab.isOpen"
            class="md-scale md-fab-top-right" ng-class="{ 'md-hover-full': fab.hover }"
                       >
            <md-fab-trigger>
                <md-button aria-label="menu" class="md-fab md-warn">
                    <i class="fa fa-plus"></i>
                </md-button>
            </md-fab-trigger>
            <md-fab-actions>
                <md-button aria-label="Create Data App" class="md-fab md-raised md-mini"
                     myapp-popover="app"
                     data-auto-close="true"
                     data-html="true"
                     data-placement="left"
                     data-animation="am-flip-x"
                     data-template-url="/templates/data-app/_v2/modules/popover-add-dataapp.html"
                     data-close-others="false"
                     data-prefix-event="url">
                  <i class="fa fa-database"></i>
                  <md-tooltip>Create Data App</md-tooltip>
                </md-button>
            </md-fab-actions>
        </md-fab-speed-dial>

我的范围很简单

$scope.fab = {
                isOpen : false,
                hover : false
            };

有什么想法吗？

Answer 1

如果我没理解错的话，您想在触发其中一个操作后保持快速拨号打开。您可以通过在操作按钮上使用 ng-click 然后在点击事件上调用 stopImmediatePropagation() 来实现。

<md-fab-actions>
    <md-button ng-click="action($event)" aria-label="Create Data App" class="md-fab md-raised md-mini">
        <md-tooltip>Create Data App</md-tooltip>
    </md-button>
</md-fab-actions>

控制器功能：

$scope.action = function($event) {
    $event.stopImmediatePropagation();
    $window.alert('clicked');
};

codepen

点击后 FAB 操作是否可能保持打开状态？

Is it possible FAB actions to stay opened after click?

javascript

angularjs

angular-material