AngularJS 在 ng-repeat 的当前迭代中定位元素答案

【问题标题】：AngularJS Targeting elements in current iteration in ng-repeatAngularJS 在 ng-repeat 的当前迭代中定位元素
【发布时间】：2015-07-24 01:40:46
【问题描述】：

我确信这个问题已经以一种或另一种形式被多次回答，但是我不确定要搜索什么来找到解决方案。

假设我们有一个简单的 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>

在 javaScript 文件中：

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

基本上我想知道应该在whatDoIPassInHere 参数中传递什么，在jquery 中类似于：$(this).siblings(input).val()

我确实有一个解决方法是给每个文本框一个唯一的 ID：

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

并使用唯一 ID 定位它，但我确信有一种更优雅的方式来处理它

【问题讨论】：

如果您来自 jquery，stackoverflow.com/questions/14994391/… 是一本不错的读物。但是给你一点方向：你会想要使用ng-model="item.name" 而不是value=...。然后你只需通过item 代替whatDoIPassInHere。
@csbarnes 感谢您的帖子。

标签： javascript angularjs angularjs-ng-repeat

【解决方案1】：

您没有将输入与模型相关联，因此 Angular 不知道如何引用该值。 See this plunkr for how to accomplish what you are asking.

控制器

$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>

【讨论】：