Проверка группы кнопок радио в угловом ng-повторении

Question

Я пытаюсь выполнить проверку группы кнопок в угловом ng-повторе.

HTML

<div ng-repeat="driver in drivers"> 
    <input required type="radio" value="M" name="driverGender" ng-model="driver.gender"> 
    <input required type="radio" value="F" name="driverGender" ng-model="driver.gender"> 
</div> 

атрибут Name должен изменить в каждом повторе. Я попытался добавить значение $ index, но он не работает должным образом, когда драйверы динамически добавляются и удаляются. Каков наилучший способ реализации этого?

Answer 1

Наконец-то я нашел одно решение.

<div ng-repeat="driver in drivers"> 
    <div ng-form="radioForm"> 
     <input required type="radio" value="M" name="driverGender{{$index}}" ng-model="driver.gender"> 
     <input required type="radio" value="F" name="driverGender{{$index}}" ngmodel="driver.gender"> 
     {{radioForm.$error}} 
    </div> 
</div> 

Теперь валидация происходит в форме ng-формы. Радио кнопки будут сгруппированы, потому что $ index.

Answer 2

В вашем коде все переключатели будут связаны друг с другом, потому что атрибут атрибута для всех одинаковый. Вы должны идентифицировать каждую группу переключателей. Например:

<div ng-repeat="driver in drivers"> 
    <input required type="radio" value="M" name="driverGender[{{driver.id}}]" ng-model="driver.gender"> 
    <input required type="radio" value="F" name="driverGender[{{driver.id}}]" ng-model="driver.gender"> 
</div> 

Answer 3

вы можете изменить имя атрибута на основе значения индекса, вы можете проверить мой ответ на следующую ссылку

В контроллере

$scope.drivers = [{id:1,name:'test',gender:'M'}]; 

В HTML

<div ng-repeat="driver in drivers"> 
    <input required type="radio" value="M" name="driverGender{{$index}}" ng-model="driver.gender"> 
    <input required type="radio" value="F" name="driverGender{{$index}}" ng-model="driver.gender"> 
</div> 

https://plnkr.co/edit/byLRBhUI2Ezc5CofHnPC?p=preview

Answer 4

Просто попробуйте это Если вам нужно, как показано ниже

думают, что их два повторы в модели, то код зрения должно быть, как это

<div ng-repeat="driver in drivers" class="ng-scope"> 
    <input required="" type="radio" value="M" name="driverGender0" ng-model="driver.gender"/> 
    <input required="" type="radio" value="F" name="driverGender0" ngmodel="driver.gender"> 
</div> 
<div ng-repeat="driver in drivers" class="ng-scope"> 
    <input required="" type="radio" value="M" name="driverGender1" ng-model="driver.gender"/> 
    <input required="" type="radio" value="F" name="driverGender1" ngmodel="driver.gender"/> 
</div> 

Так что это код получить этот

<div ng-repeat="driver in drivers"> 
    <input required type="radio" value="M" name="driverGender{{$index}}" ng-model="driver.gender"> 
    <input required type="radio" value="F" name="driverGender{{$index}}" ngmodel="driver.gender"> 
</div>