ng-model preventing checked=“checked” to select radio button by default

Question

When I use checked="checked" ng-model prevents the radio button from being selected by default. Does anyone know what could be causing this?

<input type="radio" name="unitMiles" checked="checked" id="unitMiles" value="Miles" ng-model="unit" ng-change='nextActivityStep(3)'>

Answer 1

You should be using the ngChecked directive that comes with Angular.

Doc: http://docs.angularjs.org/api/ng.directive:ngChecked

Answer 2

您可以将模型设置为输入值（在案例中$scope.unit = "Miles" ）或在输入中使用ng-checked="true" 。

Answer 3

As I commented on the accepted answer (as of writing), the ngChecked and ngModel directives shouldn't be used on the same element.

If you're using ngModel, then the checked status of the input is only a reflection of the model. To set your radio input to true by default, simply set the model accordingly.

Using the code from the OP, where the value is 'miles' and the model is units , and assuming these are scope variables, you would do something along the lines of $scope.units = 'miles' in the associated controller (or wherever).