Question

我需要在按钮点击上打开一个模态，我正在使用角度材质。我需要在右边的对话框底部有两个按钮。我使用了flex的布局，但是没有按要求工作。

HTML：

<md-dialog ng-cloak class="promptIncludeExclude-options">
<md-toolbar class="promptIncludeExclude-header">
    <div class="md-toolbar-tools">
        <span class="title">Product Inclusion Notification</span>
        <span flex></span>
        <md-button class="md-icon-button" ng-click="dialogController.closeDialog()">
            <span class="close-dialog">&#10005;</span>
        </md-button>
    </div>
</md-toolbar>
<md-dialog-content>
</md-dialog-content>
<md-dialog-actions layout="row">
    <div flex="25" flex-offset="25"><md-button ng-click="dialogController.closeDialog()" >Proceed</md-button></div>
    <div flex="50" flex-offset="20" ><md-button ng-click="dialogController.closeDialog()">Cancel</md-button></div>
</md-dialog-actions>

Answer 1

这是一个简单的布局配置。使用布局类根据需要对齐内容：

<md-dialog-actions class="layout-row layout-align-end-end">
    <md-button ng-click="dialogController.closeDialog()">Proceed</md-button>
    <md-button ng-click="dialogController.closeDialog()">Cancel</md-button>
</md-dialog-actions>

没有必要将div中的按钮包裹起来并赋予它们灵活的宽度和偏移量，而且这肯定是弄乱的东西......

flex布局不适用于md-dialog-actions

1 个答案: