修改

Question

我想在动态数据组件的md-radio-buttons之间添加行。

<md-radio-group ng-model="selected"  layout="row">
  <div ng-repeat="i in items">
    <label>{{i.name}}</label>
  <md-radio-button  value="{{i}}"></md-radio-button>
  </div>
</md-radio-group>

它应该在每两个按钮之间画一条线。线长应设置为最小距离，但如果需要可以自动增加

CodePen

Answer 1

我添加了

class="{{$last ? 'last' : '' }}"

到

md-radio-button

指令，和

<div class="line"></div>

在里面。

现在我们要做的就是将这个css代码添加到样式表中：

.line {
    position: absolute;
    height: 5px;
    width: 52px;
    background: grey;
    left: -11px;
    top: -2px;
 }

 .last .line {
      display: none;
 }

修改

我修复了我的示例以符合您的新动态要求请参阅documentation 我做的是在前后添加两个“行”div。每条线都是容器div宽度的50％，因此它们一起覆盖整个宽度。 ng-repeat中的第一个和最后一个div的处理方式不同 - ＆gt;首先不会显示“之前”行，最后不会显示“之后”

希望它能解决你的问题

如何使用标签Angular Materials

1 个答案:

修改