2017-03-01 9 views
-3

すべての配列値を(配列インデックスに基づいて)印刷するにはどうすればよいですか?angularjs ng-repeat配列インデックス

現時点では、すべての値が印刷されます。

<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に基づいて、配列値を取得しようとしたが、私はあなたがopenViewMore内の配列オブジェクトにアクセスしたい場合

+2

あなたは配列のインデックスに基づいて何をすべきかを意図していますか? – Sangharsh

+0

jsコードを追加してください。 –

+1

**問題を記述してください。** "問題はありません"は問題ありません。期待される行動がどうあるべきか教えてください。質問のタイトルに問題の概要を記入してください。 – georgeawg

答えて

0

は、パラメータとしてインデックスを渡すことを修正どのようにテーブル内のすべての配列値を持って、このようなアクセス配列。

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

または、関数にパラメータとしてオブジェクトを渡すことができます。

+0

それは内のすべての値を印刷することを – Develop

+0

<テーブルクラス= "テーブルテーブルストライプテーブル応答"> \t \t \t \t \t < TR NGリピート= "value.relatedCompaniesListでCLIST"> \t \t \t \t​​{{cList.company_name}} \t \t \t \t​​{{cList.total_debit_amount}} \t \t \t \t​​{{cList。あなたは 'テーブル内のopenViewMore'メソッドを呼び出すないときtotal_credit_amount}}これは、私のテーブル – Develop

+0

です – Develop

1

私があなたのコメントから理解しているように、誰かがその配列アイテムの「もっと見る」をクリックしたときにのみ配列のデータを表示したいとします。

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