我想在組件的md-radio-butons之間添加行與動態數據。
如何添加/創建/劃線之間的div與標籤的md-radio-buttons之間的線條Angular Materials

<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>

它應該在每兩個按鈕之間畫線。線路長度應設置爲最小距離beetween但它可以automaticaly如果需要

CodePen

來源

2016-02-29 Adam Michalski

請嘗試並提前完整描述你想要的內容。看起來你沒有足夠清楚地描述問題，即使在你的第二次和第三次編輯。 '當我把中心按鈕放在錯誤的地方時。「一個人怎麼能明白你想要的？分享一些代碼，告訴我們你想在哪裏定位按鈕，以及那些按鈕是什麼。他們是圈子嗎？或者你試圖把它放在他們的下面？請編輯您的問題作爲一個連貫的問題。如果您更改它們之間的術語，則「步驟」無關緊要。 – Thatkookooguy

當有人給我減去應該寫我做錯了什麼，我會嘗試修復它或下次避免它，其他方式（在我看來）是毫無意義的。 –

這正是我在之前的評論中試圖做的。 – Thatkookooguy

我添加

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; 
}

編輯

我固定我的例子，以匹配新的動態需求請參閱This CodePen 我所做的是在之前和之後添加兩個「行」div。每條線都是容器格寬度的50％，所以它們一起覆蓋整個寬度。在NG-重複的第一個和最後的div區別對待 - >第一將不顯示「前」行，最後將不顯示

希望「之後，」它可以解決你的問題

來源

2016-02-29 14:55:50 OST

他的意思是作爲「之前\之後」的例子。好答案！示例和所有的金光閃閃 – Thatkookooguy

確切Thatkookooguy –

編輯，當我用它爲不同的數據設置它崩潰。 –

如何添加/創建/劃線之間的div與標籤的md-radio-buttons之間的線條Angular Materials

回答

編輯

相關問題