radio button directive not binding the ngModel

Question

i am trying to create a generic radioButton directive which will take options from controller for display: ``` ``` and the options would be like ``` $scope.gender = { label: "Gender", required:true, valueList: [{ text: "Male", value: "yes" },{text:"Female", value:"no"}] }; ``` the directive is defined as: ``` app.directive("csRadioField", function () { var templateHtml = function () { return '

' + '

' + ' {{option.text}} ' + '

' + '

Accepted Answer

Try this in your template:

```
ng-model="$parent.ngModel"
```

DEMO

You're correct that `ng-repeat` creates child scopes. You're actually binding to child scopes' property.

radio button directive not binding the ngModel

Solution

Problem