angularjs ng-repeat 数组索引答案

【问题标题】：angularjs ng-repeat array indexangularjs ng-repeat 数组索引
【发布时间】：2017-03-02 00:18:58
【问题描述】：

如何打印（基于数组索引）所有数组值？

目前，它会打印所有值。

<table>
    <thead>
       <tr>
           <td>Name</td>
           <td>Designation</td>
           <td>Total Credit Amount</td>
           <td>Total Debit Amount</td>
           <td>Related Companies</td>
       </tr>
    </thead>
    <tbody>
       <tr ng-repeat="data in relTransactions track by $index">
          <td>{{data.name}}</td>
          <td>{{data.designation}}</td>
          <td>{{data.total_credit_amount}}</td>
          <td>{{data.total_debit_amount}}</td>
          <td>
              <button ng-click="openViewMore()">View More</button>
          </td>
       </tr>
    </tbody>
</table>

我尝试根据 id 获取数组值，但我得到了该表中的所有数组值我如何修复它

【问题讨论】：

根据数组索引你打算做什么？
添加你的js代码。
描述问题。“它不起作用”不是问题陈述。告诉我们预期的行为应该是什么。在问题的标题中简要说明问题。
@Develop 仍然不清楚你在问什么。
假设我有 4 个视图更多按钮，如果我单击第一个视图，则每个按钮在数组中都有不同的响应，那么我只需要打印第一个数组响应。现在它打印所有数组值

标签： angularjs arrays angularjs-ng-repeat

【解决方案1】：

据我从您的 cmets 了解到，您只想在有人单击该数组项的“查看更多”时才显示数组的数据。

您可以使用基于 $index 的 ng-show。单击查看更多时，通过功能调用更改扩展索引。我写了一个小例子看看下面。

Try on CodePen

  <html>

  <body ng-app>
        <h1>Click on view More below </h1>
    <div id="main" ng-app ng-controller="appController">
        <div ng-repeat="data in arr track by $index">
            <input type='button' value="View more" ng-click="showMore($index)"/> 
            <spna>item {{ $index }}</span>
            <span ng-show='expanded == $index'>{{data.name}}</span>
            <br><br>
            </div>
</div>

 <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.21/angular.min.js"></script>    
  </body>
</html>

在您的控制器中：

function appController($scope){
    $scope.arr = [ {name:'one'},{name:'two'},{name:'three'}];

    $scope.showMore = function(i)
    {
        $scope.expanded = i;
    }
}

【讨论】：

【解决方案2】：

如果您想访问openViewMore 中的数组对象，则将索引作为参数传递并像这样访问数组。

<button ng-click="openViewMore($index)">View More</button> 
$scope.openViewMore = function(index) {
    console.log($scope.relTransactions[index])
}

或者您可以将对象作为参数传递给函数。

<button ng-click="openViewMore(data)">View More</button> 
$scope.openViewMore = function(data) {
    console.log(data)
}

【讨论】：

它打印其中的所有值
{{cList.company_name}} {{cList.total_debit_amount}} {{cList.total_credit_amount}}
对不起，这是我的桌子
@Develop 那么你什么时候在表中调用openViewMore 方法