如何为与文本相关的角度材质的mdRadioButton指令设置垂直对齐方式？ [英] How to set vertical alignment for mdRadioButton directive of Angular Material related to text?

问题描述

如何为 mdRadioButton 指令设置与文本相关的 Angular Material 的垂直对齐方式？
我尝试了 layout-align 和 vertical-align 样式，但单选按钮始终对齐中间相关的文字。

此处是抢劫者

 < md-content> 
< md-radio-group ng-model =datastyle =vertical-align：top;> 
< md-radio-button value =aaria-label =Label 1style =vertical-align：text-top;>长文本1< / md-radio-button> 
< md-radio-button value =b>长文本2< / md-radio-button> 
< / md-radio-group> 
< / md-content> 
  

解决方案

Angular Material实际上为单选按钮生成一个容器/关闭状态和波纹。

< md-radio-button> 是父项， _md-container 是您要修改的子元素。

下面是一个带有修改过的风格的plunker的分支：

  md-radio -button ._md-container {
 top：0; 
 transform：translateY（0）; 
} 
  

希望这有助于您！

How to set vertical alignment for mdRadioButton directive of Angular Material related to text? I have tried both layout-align and vertical-align style but, the radio button is always align middle related to the text.

here is the plunker

<md-content>
    <md-radio-group ng-model="data"  style="vertical-align:top;">
        <md-radio-button value="a" aria-label="Label 1" style="vertical-align:text-top;">long text 1</md-radio-button>
        <md-radio-button value="b"> long text 2 </md-radio-button>
    </md-radio-group>
</md-content>

解决方案

Angular Material actually generates a container for the radio button's on/off state and ripple.

<md-radio-button> is the parent and _md-container is the child element you want to modify.

Here's a fork of the plunker with the modified styles:

md-radio-button ._md-container {
    top: 0;
    transform: translateY(0);
}

Hope this helps!

这篇关于如何为与文本相关的角度材质的mdRadioButton指令设置垂直对齐方式？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！