Getting selected radio buttons from different sets of radio buttons in Angular.js

Issue

Just started in Angular.js and have ran into a little hiccup that is taking a lot longer than it should to figure out. I have 3 sets of 4 radio buttons. I'm trying to access which radio buttons the user has selected in each set. The problem is so far I can only do it with one set. If there's more than one set, after the user selects one radio button, all the sets switch to that selected radio button. I'm pretty sure it has to do with my ng-model="$parent.selected" but I'm not sure how to fix it.

I couldn't get Angular working with JSFiddle for some reason so here's what I have:

HTML:

<form name="myForm" ng-controller="testController">

  <div ng-repeat="question in questions | limitTo:3">

    <div>{{question.Question}}</div>

    <input type="radio" ng-model="$parent.selected" value="A" name="{{question.id}}" />{{question.A}}<br />
    <input type="radio" ng-model="$parent.selected" value="B" name="{{question.id}}" />{{question.B}}<br />
    <input type="radio" ng-model="$parent.selected" value="C" name="{{question.id}}" />{{question.C}}<br />
    <input type="radio" ng-model="$parent.selected" value="D" name="{{question.id}}" />{{question.D}}<br />

    Selected = {{selected}}

  </div>

</form>

JS:

angular.module('nodeServerApp')
.controller('testController', function ($scope) {

 $scope.questions = 
 [
     {
         "id": 0,
         "Question": "Is C the right answer?",
         "A": "This is choice A.",
         "B": "This is choice B.",
         "C": "This is choice C.",
         "D": "This is choice D.",
         "Answer": "C"
     },
     {
         "id": 1,
         "Question": "Is A the right answer?",
         "A": "This is choice A.",
         "B": "This is choice B.",
         "C": "This is choice C.",
         "D": "This is choice D.",
         "Answer": "A"
     },
     {
         "id": 2,
         "Question": "Is D the right answer?",
         "A": "This is choice A.",
         "B": "This is choice B.",
         "C": "This is choice C.",
         "D": "This is choice D.",
         "Answer": "D"
     }
 ];

 });

Solution

The ngModel should be selected, not $parent.selected (which would have been shared by all questions)...

<input type="radio" ng-model="selected" value="A" name="{{question.id}}" />{{question.A}}<br />
<input type="radio" ng-model="selected" value="B" name="{{question.id}}" />{{question.B}}<br />
<input type="radio" ng-model="selected" value="C" name="{{question.id}}" />{{question.C}}<br />
<input type="radio" ng-model="selected" value="D" name="{{question.id}}" />{{question.D}}<br />

Selected = {{selected}}

Also consider putting selected on question so everything is in one place...

<input type="radio" ng-model="question.selected" value="A" name="{{question.id}}" />{{question.A}}<br />
<input type="radio" ng-model="question.selected" value="B" name="{{question.id}}" />{{question.B}}<br />
<input type="radio" ng-model="question.selected" value="C" name="{{question.id}}" />{{question.C}}<br />
<input type="radio" ng-model="question.selected" value="D" name="{{question.id}}" />{{question.D}}<br />

Selected = {{question.selected}} {{question.selected === question.Answer ? "Correct" : "Incorrect"}}

Answered By - Anthony Chu