ng-repeatから選択した値を取得する方法

ng-repeatでデータを取得し、下のコードのように表示します。

名前のいずれかをクリックすると、その名前で私に警告する必要があります。どうすればこれを達成できますか？

var myfriend = angular.module('myfriend',[]); 
 

 
myfriend.controller('myfriendController', function($scope) 
 
{ 
 
    $scope.record = [ 
 
     {  "id" : "01", 
 
      "firstname" : "Mohan ", 
 
      "middlename" : "K", 
 
      "lastname" : "Futterkiste1" 
 
     },{ 
 
      "id" : "04", 
 
      "firstname" : "Rohan ", 
 
      "middlename" : "A", 
 
      "lastname" : "Futterkiste2" 
 
     },{ 
 
       "id" : "08", 
 
      "firstname" : "sohan ", 
 
      "middlename" : "M", 
 
      "lastname" : "Futterkiste3" 
 
     } 
 
    ] 
 
       
 
    
 
});

<html> 
 
    <head> 
 
      <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script> 
 

 
    </head> 
 
    <body ng-app="myfriend"> 
 
    
 
    
 
    
 
    <table class="table" style="border:1px red solid; width:100%; " ng-controller="myfriendController"> 
 
\t \t  <thead> 
 
\t \t  <tr> 
 
\t \t  \t <th>Id</th> 
 
\t \t   <th>First name</th> 
 
\t \t   <th>Middle name</th> 
 
    \t \t   <th>Last name</th> 
 
\t \t  </tr> 
 
\t \t  </thead> 
 
\t \t  <tbody> 
 
\t \t  <tr ng-repeat="x in record"> 
 
    \t \t   <th>{{x.id}}</th> 
 
    \t \t   <th ng-click="selectInfo(x.id)"> {{x.firstname}}</th> 
 
       <th>{{x.middlename}}</th> 
 
       <th>{{x.lastname}}</th> 
 
\t \t  </tr> 
 
\t \t  </tbody> 
 
\t </table> 
 
    <body> 
 
</html>

出典

2017-01-19 Mohammed

は、あなたがする必要がある機能を作りますhtmlを変更し、コントローラファイルにselectInfo関数を追加してください。

HTML

<table> 
     <tr ng-repeat="x in record"> 
        <th>{{x.id}}</th> 
        <th ng-click="selectInfo(x.firstname)"> {{x.firstname}}</th> 
        <th ng-click="selectInfo(x.middlename)">{{x.middlename}}</th> 
        <th ng-click="selectInfo(x.lastname)">{{x.lastname}}</th> 
        </tr> 
    </table>

コード

$scope.selectInfo=function(name){ 
alert(name); 
}

出典

2017-01-19 11:23:06

あなたはこれまでのところ良いうとしています。 ng-clickイベントを追加しました。しかし、あなたがコントローラであるに名を取得するために必要なAAL、あなたはここで <th ng-click="selectInfo(x)">{{x.firstname}}</th>

を参照してくださいarguement として、現在のアイテムをPaaSをする必要があるとコントローラに

$scope.selectInfo = function (item) { 
    alert(item.firstname); 
    // Or use this to do whatever you want 
}

出典

2017-01-19 11:21:46 Shubhranshu

ng-repeatから選択した値を取得する方法

答えて

関連する問題