CODEWITHSUNDEEP
angularjsangularjs-ng-repeatangular-ngmodel
Tuvia Khusid
Tuvia Khusid

Reputation: 872

How to watch ng-model included in ng-repeat?

This is my html code:

<table>
            <tr ng-repeat="park in parkOptions.parks">
                <td>
                    <label for="{{park.park_id}}">
                        <input id="{{park.park_id}}" type="radio" name="connection" ng-model="$parent.currentPark" value="{{park.park_id}}" ng-click="selectValue('park',park)"/>{{park.park_name}}
                    </label>
                </td>
            </tr>
        </table>

How can i watch the changes in my model( I mean i want to see in $watch another park when i click radio button)

Upvotes: 3

Views: 4184

Answers (1)

camden_kid
camden_kid

Reputation: 12813

I've got a working version to help you - Fiddle.

HTML

<div ng-app ng-controller="ParentCtrl">
    <div ng-controller="ChildCtrl">
        <table>
            <tr ng-repeat="park in parkOptions.parks">
                <td>
                    <label for="{{park.park_id}}">
                        <input id="{{park.park_id}}" type="radio" name="connection" ng-model="parkOptions.currentPark" value="{{park.park_id}}" ng-click="selectValue(park)"/> {{park.park_name}}
                    </label>
                </td>
            </tr>
        </table>
        </div>
</div>

JS

function ParentCtrl($scope) {
}

function ChildCtrl($scope) {
    $scope.parkOptions = {};
    $scope.parkOptions.parks = [
        {park_id: '01', park_name: 'England Park'},
        {park_id: '02', park_name: 'France Park'}
    ];
    $scope.$watch('parkOptions.currentPark', function(newValue) {
        if (newValue != undefined) {
            console.log(newValue);
        }
    });
}

This may not be exactly what you want (as I see $parent in your code) but we can come to the right solution with any further information from you.

I don't use $parent and prefer sending and receiving events.

Upvotes: 1

Related Questions