简体   繁体   English

如何使用Angular.js从表中获取选定的值

[英]How to get selected value from table using Angular.js

I need one help.I need some selected value using check box select using Angular.js.I am explaining my code below. 我需要一个帮助。我需要使用Angular.js的复选框选择一些选定的值。我在下面解释我的代码。

    <tr dir-paginate="pro in listOfReview | itemsPerPage:5">
    <td><input type="checkbox" ng-model="selected[pro.review_id]" ng-false-value="undefined"></td>
    <td>{{$index+1}}</td>
    <td>{{pro.Product_name}}</td>
    <td>{{pro.title}}</td>
    <td>{{pro.description}}</td>
    <td>{{pro.rating}}</td>
     <td ng-if="pro.status==0">Not Approved</td>
    <td ng-if="pro.status==1">Approved</td>
    <td ng-if="pro.status==1">
    <a ui-sref="review">
    <input type='button' class='btn btn-xs btn-red' value='Reject' ng-click="RejectStatus(pro.review_id,pro.status);" >  
    </a>
    </td>
    <td ng-if="pro.status==0">
    <a ui-sref="review">
    <input type='button' class='btn btn-xs btn-green' value='Approve' ng-click="ApproveStatus(pro.review_id,pro.status);" >  
    </a>
     </td>
    </tr>   
 <input type='button' class='btn btn-xs btn-green' value='Approve' ng-click="ApproveStatus();">  

The controller side code is given below. 控制器端代码如下。

$scope.selected = {};
 $scope.ApproveStatus=function(){
         console.log('approve',$scope.selected);
}

right now i am getting the selected value like this approve Object {4: true} .Here i need to assign pro.review_id value to a key like( review:id:4 ) so that i can easily fetch those using loop.Here also my requirement is when at least one check box will select the Approve button present at bottom will display to the user.Please help me. 现在我正在像选择approve Object {4: true}那样获得选定的值。在这里,我需要将pro.review_id值分配给像( review:id:4 )这样的键,以便我可以轻松地使用loop来获取它们。我的要求是,至少有一个复选框将选中底部显示的“批准”按钮时,才会显示给用户。请帮助我。

plunker link Click here 链接链接点击这里

You can bind an extra property with check box like I did below. 您可以像下面那样用复选框绑定额外的属性。

<!doctype html>
<html ng-app>
  <head>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.5/angular.min.js"></script>
    <script src="script.js"></script>

  </head>
  <body>

    <div ng-controller="Ctrl">

      <table>
        <tr><td></td><td>Name</td><td>Type</td><td>Price</td></tr>
        <tr ng-repeat="p in prods">
          <td><input type='checkbox' value ="p.checked" ng-model="p.checked"></td>
          <td>{{p.name}}</td>
          <td>{{p.type}}</td>
          <td>{{p.price}}</td>
          <td>Delete</td>
          <td>Modify</td>
        </tr>

      </table>

      <input type="button" value="Approve" ng-click="ApproveStatus()" />
    </div>

  </body>
</html>


function Ctrl($scope) {


  $scope.prods = [
    {'id':'0', 'name' : 'Title1', 'type' : 'Zip code', 'price' : '11'},
    {'id':'1', 'name' : 'Title2', 'type' : 'MD', 'price' : '222'},
    {'id':'2', 'name' : 'Title3', 'type' : 'DMS', 'price' : '2222'}
];


  $scope.ApproveStatus = function(){
    console.log('value is:' + $scope.prods.length);
    for(var i =0; i < $scope.prods.length ;i++){
    if($scope.prods[i].checked){
         console.log($scope.prods[i].id)      
      }
    }

  };
}

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM