2016-10-22 78 views
0

我有这样一个JSON,我想它的标志值集团和领域

$scope.staffs = [ 

     { 
      "id": 1, 
      "name": "Management", 
      "Flag": 1 
     }, 
     { 
      "id": 2, 
      "name": "Revenue Collection/Ledger", 
      "Flag": 1 
     }, 
     { 
      "id": 3, 
      "name": "Office Assistance", 
      "Flag": 1 
     }, 
     { 
      "id": 4, 
      "name": "Operators (Source)", 
      "Flag": 2 
     }, 
     { 
      "id": 5, 
      "name": "Operators (WTP)", 
      "Flag": 2 
     }, 
     { 
      "id": 6, 
      "name": "Operators at Networks", 
      "Flag": 2 
     } 
    ] 

计算字段的总和,组和我的HTML是这样在这里我想要什么当用户把价值常驻现场应该找到它标志值,并计算常驻领域的总和与标志值,如果标志值是1个放总和wspStaffTotal.Admin_Perm_Total,如果标志值是2将总和wspStaffTotal .Technical_Perm_Total

<div ng-repeat="wspStaffTbl in staffs"> 
{{ wspStaffTbl.name }} 
<input type="text" ng-model="wspStaffTbl.Permanent" ng-change="updatePermanentTotal()"> 
</div> 

<input type="text" ng-model="wspStaffTotal.Admin_Perm_Total"> 
<input type="text" ng-model="wspStaffTotal.Technical_Perm_Total"> 

是我的尝试是

$scope.updatePermanentTotal = function(){ 
    $scope.wspStaffTotal.Admin_Perm_Total = 0; 
    $scope.wspStaffTotal.Technical_Perm_Total = 0; 

    angular.forEach($scope.staffs, function(value, key){ 

    if(!isNaN(parseInt(value.Permanent))){ 
     if(value.Flag==1){ 
      $scope.wspStaffTotal.Admin_Perm_Total = $scope.wspStaffTotal.Admin_Perm_Total + parseInt(value.Permanent); 
      } 
    if(value.Flag==2){ 
      $scope.wspStaffTotal.Technical_Perm_Total = $scope.wspStaffTotal.Technical_Perm_Total + parseInt(value.Permanent); 
      } 
    } 
}) 
} 

但预计它无法正常工作。

+0

运行在每此功能陈ge会花费你很多的表现... –

+0

是啊我知道有没有其他方式? – sanu

+0

反跳才能解决您的性能问题... https://lodash.com/docs/4.16.4#debounce –

回答

2

我希望这是你希望的东西...

app.js

var myApp = angular.module('test' , []); 
myApp.controller('test_ctrl' , function($scope){ 
    $scope.staffs = [ 

     { 
      "id": 1, 
      "name": "Management", 
      "Flag": 1 
     }, 
     { 
      "id": 2, 
      "name": "Revenue Collection/Ledger", 
      "Flag": 1 
     }, 
     { 
      "id": 3, 
      "name": "Office Assistance", 
      "Flag": 1 
     }, 
     { 
      "id": 4, 
      "name": "Operators (Source)", 
      "Flag": 2 
     }, 
     { 
      "id": 5, 
      "name": "Operators (WTP)", 
      "Flag": 2 
     }, 
     { 
      "id": 6, 
      "name": "Operators at Networks", 
      "Flag": 2 
     } 
    ]; 

    $scope.updatePermanentTotal = function(){ 
     $scope.wspStaffTotal = { 
      Admin_Perm_Total: 0, 
      Technical_Perm_Total :0 
     } 

     angular.forEach($scope.staffs, function(value, index){ 

      if(!isNaN(parseInt(value.Permanent))){ 
       if(value.Flag==1){ 
        $scope.wspStaffTotal.Admin_Perm_Total = $scope.wspStaffTotal.Admin_Perm_Total + parseInt(value.Permanent); 

       } 
       if(value.Flag==2){ 
        $scope.wspStaffTotal.Technical_Perm_Total = $scope.wspStaffTotal.Technical_Perm_Total + parseInt(value.Permanent); 
       } 
      }else{ 
       console.log("value is NAN"); 
      } 

     }); 
     alert("result flag1:{" +$scope.wspStaffTotal.Admin_Perm_Total+"} flag2: {" +$scope.wspStaffTotal.Technical_Perm_Total +"}"); 
    } 
}); 

HTML

<html ng-app="test"> 

<head> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script> 
    <script src="app.js"></script> 

</head> 
<body ng-controller="test_ctrl"> 
<div ng-repeat="wspStaffTbl in staffs"> 
    {{ wspStaffTbl.name }} 
    <input type="text" ng-model="wspStaffTbl.Permanent" ng-change="updatePermanentTotal()"> 
</div> 

<input type="text" ng-model="wspStaffTotal.Admin_Perm_Total"> 
<input type="text" ng-model="wspStaffTotal.Technical_Perm_Total"> 

</body> 
</html> 
+0

什么是你的代码和我的不同? – sanu

+0

$ scope.wspStaffTotal = { Admin_Perm_Total:0, Technical_Perm_Total:0 } 使其工作 你试试我的吗? –

+0

它正在工作。怎么样? – sanu

0

首先使永久值在控制器的阵列

$scope.webStaffTbl.Permanent = []; 

然后传递这些将值给该函数:

<input type="text" ng-model="wspStaffTbl.Permanent[$index]" ng-change="updatePermanentTotal(wspStaffTbl.Permanent[$index],wspStaffTbl.flag)"> 

,并用它的标志的永久值传递给函数

然后在$ scope函数中这样做:

$scope.updatePermanentTotal = function(permanentValue,flag){ 


$scope.wspStaffTotal.Admin_Perm_Total = 0; 
    $scope.wspStaffTotal.Technical_Perm_Total = 0; 

    angular.forEach($scope.staffs, function(value, key){ 

    if(!isNaN(parseInt(permanentValue))){ 
     if(flag==1){ 

      $scope.wspStaffTotal.Admin_Perm_Total = $scope.wspStaffTotal.Admin_Perm_Total + parseInt(permanentValue); 
      } 
    if(flag==2){ 

      } 
    } 
}) 
}