angularjs - Radio Buttons ng-checked with ng-model -

in html page, have 2 sets of boolean based radio buttons: labeled: "yes" , "no" / values: true , false respectively. i'm populating full form postgresql database table allow authenticated user view form populated data , edit populated fields including radio buttons, save form save data db. of other text fields populate without issue; it's both collection of radio buttons having issue pre-checkmarking radio buttons.

the below not pre-populate checked on front end (but adds correct attribute of checked in html source):

    <input id="billing-no" type="radio" name="billing" ng-model="person.billing" value="false" ng-checked="person.billing == 'false'" />     <input id="billing-yes" type="radio" name="billing" ng-model="person.billing" value="true" ng-checked="person.billing == 'true'" /> 

however, check correct radio button on load:

    <input id="billing-no" type="radio" name="billing" value="false" ng-checked="person.billing == 'false'" />     <input id="billing-yes" type="radio" name="billing" value="true" ng-checked="person.billing == 'true'" /> 

note: needed check against string boolean value in directive ng-checked since boolean value comes string postgresql. this, apparently, part of postgresql's design when querying data columns have boolean data types.

when adding ng-model directive, radio button no longer checked (at least in rendered browser view). odd part looked @ source , checks correct one. what's more odd, have click on radio button twice 'check' it. i've tested in latest version of chrome, ff, , ie , results in same issue.

the question is: when adding ng-model directive, why html source add 'checked' in radio button attribute, seemingly not mark radio button? furthermore, why have click twice on radio button supposed checked?

---

solution: fix this, removed ng-checked directive radio buttons , used ng-model suggested @cypher , @aet. replaced attribute value directive ng-value "true" & "false". after, set values in controller.

html

<input id="billing-no" type="radio" name="billing" ng-model="person.billing" ng-value="false" /> <input id="billing-yes" type="radio" name="billing" ng-model="person.billing" ng-value="true" /> 

angular js

app.controller('peoplectrl', function($scope, peoplefactory){     ...     peoplefactory.getperson(personparams).then(function(data){         $scope.person = data;         /* moved ng-checked */         $scope.person.billing = data.billing == 'true';     });     ... }; 

i think should use ng-model , should work you, here link official documentation of angular https://docs.angularjs.org/api/ng/input/input%5bradio%5d

the code example should not difficult adapt specific situation:

<script>    function ctrl($scope) {       $scope.color = 'blue';       $scope.specialvalue = {          "id": "12345",          "value": "green"       };    } </script> <form name="myform" ng-controller="ctrl">    <input type="radio" ng-model="color" value="red">  red <br/>    <input type="radio" ng-model="color" ng-value="specialvalue"> green <br/>    <input type="radio" ng-model="color" value="blue"> blue <br/>    <tt>color = {{color | json}}</tt><br/> </form>