更改 Angular Material 扩展面板切换图标定位

Question

angular 扩展面板右侧有一个默认切换按钮，如下所示：

我已尝试查看文档，但找不到我想要的内容。有没有一种简单的方法可以将切换按钮放在标题（个人数据）的左侧，而不是一直放在右侧？

有一些属性可以隐藏切换按钮，但与更改其位置无关。

Answer 1

您可以通过覆盖默认样式规则来重新定位箭头按钮。在这种情况下，您正在查看 mat-expansion-panel-header class。

.mat-expansion-panel-header {
  flex-direction: row-reverse;
}
.mat-content {
  padding-left: 10px;
}