CODEWITHSUNDEEP
angularjs
Noor
Noor

Reputation: 20150

ng-model not updating with radio button

I'm getting a problem with angular and I'm not understanding what the problem may be:

thats a div:

<div ng-controller="CountrySelectorController">
            Selected Countryid = {{countryid}}
            <div class="radio" ng-repeat="country in countries">
                <input type="radio" name="countryOptions" ng-model="countryid" value={{country.countryid}} ng-checked="countryid == country.countryid" /><span style="margin-left:10px;">{{country.countryid}}.{{country.name}}</span>
                </label>
            </div>
</div>

thats my controller:

app.controller('CountrySelectorController', function($scope, $rootScope){
    $scope.countryid = 1;
});

the problems I'm getting: -Selected Countryid=1 appears at start . Although I'm selecting different countries, the model is not updating

Upvotes: 2

Views: 1808

Answers (1)

Jerrad
Jerrad

Reputation: 5290

ng-repeat creates its own scope, which is not what you want to bind the ng-model to. You want to bind ng-model to the controller's scope (which is the parent scope of the ng-repeat). Use $parent to go up a level to the correct scope. Also, don't use ng-checked.

ng-model="$parent.countryid"

Demo

Upvotes: 4

Related Questions