html - md-radio-group 的标签

Question

我在 Angular 4 Material 应用程序中有一组单选按钮:

<md-radio-group fxLayout fxLayoutAlign="center center" fxLayoutGap="30px">
    <md-radio-button value="1">Date</md-radio-button>
    <md-radio-button value="2">Status</md-radio-button>
    <md-radio-button value="3">From</md-radio-button>
    <md-radio-button value="4">To</md-radio-button>
</md-radio-group>

我查看了文档和示例，但无法弄清楚如何为该组添加标签。我需要这样的东西，但要有适当的样式:

在 Angular Material 中向单选组添加标签的预期方式是什么？

显然，我们可以添加一个 label 并从头开始设计它的样式，但对于样式繁多的组件框架来说，它看起来并不是很有效率。

Answer 1

这就是您要找的。

<div fxLayout fxLayoutAlign="center center" fxLayoutGap="30px">
      <label>Sort by</label>  
      <md-radio-group>
        <md-radio-button value="1">Date</md-radio-button>
        <md-radio-button value="2">Status</md-radio-button>
        <md-radio-button value="3">From</md-radio-button>
        <md-radio-button value="4">To</md-radio-button>
      </md-radio-group>
  </div>

CSS

.mat-radio-button {margin-right: 30px;}

否则将 flexLayout 添加到您的 md-radio-group

<md-radio-group fxLayout fxLayoutAlign="center center" fxLayoutGap="30px">