2016-08-15 50 views
0

說我有一個如下所示的html塊,我需要遍歷一個對象數組,並顯示每個選項的標籤。沒有dom元素的角度ng循環

我可以很容易地使用ng-repeat作爲標籤和輸入,但爲了讓我的樣式框架正確更新檢查的輸入,輸入需要直接在文檔中的標籤上方。

我怎樣才能做到這一點,而不包裝每個組的輸入+標籤在另一個DOM元素? (這會破壞列表的樣式也一樣)

需要:

 <input type="radio" name="rGroup" value="1" id="r1" /> 
     <label class="radio radio-plan-lg" for="r1"> 
      Billed every<br><span>1 month</span> 
     </label> 

     <input type="radio" name="rGroup" value="2" id="r2" /> 
     <label class="radio radio-plan-lg" for="r2"> 
      Billed every<br><span>3 months</span> 
     </label> 

     <input type="radio" name="rGroup" value="3" id="r3" /> 
     <label class="radio radio-plan-lg" for="r3"> 
      Billed every<br><span>6 months</span> 
     </label> 

不是:

 <input type="radio" name="rGroup" value="1" id="r1" /> 
     <input type="radio" name="rGroup" value="2" id="r2" /> 
     <input type="radio" name="rGroup" value="3" id="r3" /> 

     <label class="radio radio-plan-lg" for="r1"> 
      Billed every<br><span>1 month</span> 
     </label> 
     <label class="radio radio-plan-lg" for="r2"> 
      Billed every<br><span>3 months</span> 
     </label> 
     <label class="radio radio-plan-lg" for="r3"> 
      Billed every<br><span>6 months</span> 
     </label> 

回答

2

使用ng-repeat-start

<input ng-repeat-start="item in array" type="radio" name="rGroup" value="{{item}}" id="r{{item}}" /> 
<label ng-repeat-end class="radio radio-plan-lg" for="r{{item}}"> 
    Billed every<br><span>{{item}} month</span> 
</label> 

See Documentation - Special repeat start and end points