最初のラジオボタンをループで埋める方法は？

Question

ここではangularjsを使用しています。最初のラジオボタンをループで埋める方法を知りたいと思います。最後のラジオボタンに塗りつぶしがあるためです。

<div class="col m6 s12" ng-repeat="p in priceList"> 
    <p> 
     <input class="with-gap" name="subsgroup" type="radio" id="{{p.subsription }}" ng-checked="true" /> 
     <label for="{{p.subsription}}">{{ p.price | currency }} per {{p.subsription}}</label> 
    </p> 

Answer 1

あなたはをループして、あなたが行くようにng-checkedを設定しています。それらはすべて同じラジオボタングループに入っているので、最後にチェックされたものが当然です。

以下の例に示すように$indexを使用して、最初の要素があるかどうかを確認し、その要素のラジオボタンのみを表示することができます。オプションで、$firstを使用して見ることができます。

<div class="col m6 s12" ng-repeat="p in priceList"> 
    <p> 
     <input ng-if="$index == 0" class="with-gap" name="subsgroup" type="radio" id="{{p.subsription }}" ng-checked="true" /> 
     <input ng-if="$index != 0" class="with-gap" name="subsgroup" type="radio" id="{{p.subsription }}" /> 
     <label for="{{p.subsription}}">{{ p.price | currency }} per {{p.subsription}}</label> 
    </p> 
</div>