CODEWITHSUNDEEP
javascripthtmlangularjs
kramer65
kramer65

Reputation: 54013

Why does radio button with ng-repeat not work?

I've got a simple ng-repeat with a radio button which refuses to function. The following works perfectly fine:

<label class="radio-inline">
    <input type="radio" ng-model="display_as"  name="display_as" value="1">position 1
    <input type="radio" ng-model="display_as"  name="display_as" value="2">position 2
</label>
<pre>{{ display_as }}</pre>

but with the following I do see two radio buttons (as expected) and I can select eitherone of the two radio buttons, but $scope.display_as remains undefined.

<label ng-repeat="position in user.positions" class="radio-inline">
    <input type="radio" ng-model="display_as"  name="display_as" value="{{ $index }}">{{ position.name }}
</label>
<pre>{{ display_as }}</pre>

Why oh why?! Could anybody enlighten me as to what I'm doing wrong in my ng-repeat?

Upvotes: 1

Views: 500

Answers (1)

tao
tao

Reputation: 90277

ng-repeat creates a separate child $scope for each iteration through user.positions. None of those $scopes have a display_as property.

You can access the parent $scope inside an ng-repeat by using $parent. In your case: $parent.display_as.

Upvotes: 3

Related Questions