如何在圆角材料中水平对齐单选按钮？ [英] How to align the radio buttons horizontally in angular material?

问题描述

这是一个

只需在 md-radio-group 中添加 layout =row属性。

I was expecting a in-built directive or a tag for this but probably not according to their documentation.

This is the example.

<div class="radioButtondemoBasicUsage" ng-app="MyApp">
<form ng-submit="submit()" ng-controller="AppCtrl">
<p>Selected Value: <span class="radioValue">{{ data.group1 }}</span> </p>

<md-radio-group ng-model="data.group1">

  <md-radio-button value="Apple" class="md-primary">Apple</md-radio-button>
  <md-radio-button value="Banana"> Banana </md-radio-button>
  <md-radio-button value="Mango">Mango</md-radio-button>

</md-radio-group>

解决方案

You do not need to override any default CSS:

<md-radio-group layout="row">
  <md-radio-button value=0 class="md-primary">On</md-radio-button>
  <md-radio-button value=1> Off </md-radio-button>
</md-radio-group>

Just put in md-radio-group tag a layout="row" attribute.

这篇关于如何在圆角材料中水平对齐单选按钮？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！