You have some syntax errors, missing model values and some unnecessary markup. First, you can get rid of the ng-checked
altogether. That will be handled automatically if you set your ng-model
and ng-value
properly. Since your objects are unique there's no need for track by
.
When using AngularJS directives (such as ng-value
) you do not need to use braces to reference your model values. So ng-value="{{person}}"
becomes ng-value="person"
.
You refer to myObj.person
, but there doesn't appear to be a corresponding model value. Below is an edit of the code and markup you have provided showing that it really does work to use an object as the value for your radio buttons.
angular.module('app', [])
.controller('MyCtrl', ($scope) => {
$scope.people = [{
name: "John",
id: "J"
}, {
name: "Paul",
id: "P"
}, {
name: "George",
id: "G"
}, {
name: "Ringo",
id: "R"
}];
$scope.myObj = {
person: $scope.people[1]
};
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.7.2/angular.min.js"></script>
<div ng-app="app" ng-controller="MyCtrl">
<form name="myForm">
<p>Decisions</p>
<ul>
<li ng-repeat="person in people">
<label>
{{ person.name }}
<input type="radio" ng-model="myObj.person"
name="sameName" ng-value="person" />
</label>
</li>
</ul>
</form>
<div>
{{ myObj.person }}
</div>
</div>