什么是放置取消按钮的 Angular Material 指南

【问题标题】：What is an Angular Material guideline to place Cancel button什么是放置取消按钮的 Angular Material 指南
【发布时间】：2020-06-29 09:20:38
【问题描述】：

Angular Material 指南应将“取消”和“创建”按钮放置在哪里？

应该在右下角，但在“创建”按钮之前，如“取消|创建”，应该放在右下角，还是应该放在“创建”之后，如“创建|取消”？

【问题讨论】：

Angular 是一个 Web 框架，它不会告诉您将哪些按钮放在哪里。它的guidelines 是关于代码样式，而不是页面布局。
@jonrsharpe angular 是一个 web 框架，Material 是一个设计系统
@alessandro 是的，请注意我的评论在编辑标题之前指定 Angular Material 指南。

标签： angular-material material-design user-experience

【解决方案1】：

正如您在material design spec 中看到的那样

操作按钮排列如对话框设计文章中所述， mdc-dialog__actions 元素中的按钮已排列默认水平，with the confirming action last。

如果按钮文本太长以至于所有按钮都无法放入单行，按钮垂直堆叠，with the confirming action first.

默认情况下，MDC 对话框会自动检测并处理此问题，应用堆叠布局时反转按钮。

所以“创建”按钮应该放在最后，或者首先，这取决于它的尺寸。

【讨论】：