0

Я учусь angularJS и пытается использовать ng-model, ng-checked и ng-if вместе радиокнопокнг проверил Радиокнопка не устанавливая значение нг-модели в AngularJS на странице загрузки

<html> 
<head> 
    <title>Angular JS Radio Button Test</title> 
</head> 
<body ng-app=""> 
    <input type="radio" name="gender" value="M" ng-model="selectedGender" ng-checked="true"/>M<br /> 
    <input type="radio" name="gender" value="F" ng-model="selectedGender" />F<br /> 
    <div ng-if="selectedGender == 'M'"> 
     Male 
    </div> 
    <div ng-if="selectedGender == 'F'"> 
     Female 
    </div> 

</body> 
<script src = "https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>  
</html> 

Теперь на начальной странице загружается, переключатель «M» отмечен, но все же деление <div ng-if="selectedGender == 'M'"> не отображается, если только я не нажму на него снова, после чего он будет работать.

В чем причина этой проблемы и как ее можно исправить.

Заранее спасибо.

ответ

1

Вы можете инициализировать в «ng-init», как показано ниже.

<body ng-app="" ng-init="selectedGender = 'M'"> 
    <input type="radio" name="gender" value="M" ng-model="selectedGender" ng-checked="true"/>M<br /> 
    <input type="radio" name="gender" value="F" ng-model="selectedGender" />F<br /> 
    <div ng-if="selectedGender == 'M'"> 
     Male 
    </div> 
    <div ng-if="selectedGender == 'F'"> 
     Female 
    </div> 

</body> 

Рабочий плукер here.

+0

просто FYI, добавив, что 'нг-init', мне не нужно использовать, что' нг-checked' директивы. –

+0

Yep .., true.Спасибо .. @AyushGupta –

2

ng-checked Не установлено значение ng-model

Это только поможет вам проверить или снимите флажок значения на основе значения области действия. Используя директиву ng-check, вам не нужно использовать интерполяцию {{}}, вы можете использовать значения области для формирования в ней выражения.

From docs

Примечание, что эта директива не должна использоваться вместе с ngModel, так как это может привести к непредсказуемому поведению.

Вы должны установить нг-модели значение на intial нагрузки внутри контроллера

$scope.selectedGender = 'M' 
+0

Я вижу ... не имеет смысла, хотя ... –

+0

Что значит? Не имеет смысла. –

+0

Я имею в виду, что угловая «функция» 'ng-checked', не задающая' ng-model', немного «багги». –

 Смежные вопросы

  • Нет связанных вопросов^_^