AngularJS targeting elements in the current iteration in ng-repeat

I am sure that this question has been answered repeatedly in one form or another, but I am not sure what to look for in order to find a solution.

Say we have a simple ng-repeat:

<div ng-repeat="item in items">
   <input type="text" value="{{item.name}}">
   <a ng-click="getTxtBoxVal(whatDoIPassInHere)">Get Text Box Value</a>
</div>

in javaScript file:

   function $scope.getTxtBoxVal(val) {
       alert(val)
   }

Basically I want to know what should be passed in a parameter whatDoIPassInHere, which in jquery would be something like this:$(this).siblings(input).val()


I have a workaround that should give each text field a unique identifier:

<input type="text" id="myTextBox_{{index}}" value="{{item.name}} >

and configure it with a unique id, but I'm sure there is a more elegant way to handle this

+4
source share
1 answer

, angular , . . plunkr , .

$scope.things = [
    {
      'name': 'apple',
      'value': '12',
      'isTasty': true
    },
    {
      'name': 'tire',
      'value': '7',
      'isTasty': false
    },
    {
      'name': 'carrot',
      'value': '9',
      'isTasty': false
    },
    {
      'name': 'cake',
      'value': '1',
      'isTasty': true
    }
  ];

  $scope.getVal = function (value) {
    alert(value);
  };

<div ng-repeat="item in things">
      <input type="text" ng-model="item.name" value="{{item.name}}">
      <a href="#" ng-click="getVal(item.name)">Get Text Box Value</a>
    </div>
+4

Source: https://habr.com/ru/post/1599364/


All Articles