J. Smith J. Smith - 6 months ago 9
AngularJS Question

ng-repeat with click modifying input

<input ng-model = "val">
<a href ng-click="val = 1"> val = 1 </a>
<div class="test" ng-controller="Ctrl">
<table>
<thead>
<tr>
<th>let</th>
<th>num</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="thing in data">
<td>
<a href ng-click="val = 1">
{{thing.let}}
</a>
</td>
<td>{{thing.num}}</td>
</tr>
</tbody>






Is there a way to make an input change based on a click in an ng-repeat?
In this jsfiddle you can the input change with a click outside of an ng-repeat, but in the repeat it doesn't change the input.

http://jsfiddle.net/Hp4W7/2403/

Answer

The problem is that you are setting the val property in a child scope created by ng-repeat.

The solution is to create a function that assigns this value to the parent scope:

$scope.changeVal = function(val){
    $scope.$parent.val = val;
}

And call it with ng-click="changeVal(1)"

Fiddle here: http://jsfiddle.net/nawd7jjc/

Comments