2016-10-22 6 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); 
      } 
    } 
}) 
} 

하지만 예상대로 작동하지 않습니다.

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

및 기능의 플래그 영구 값을 전달 : 우선

+0

마다에이 기능을 실행 app.js에 대한 ... 무엇을 원하는 바란다 찬 ge는 당신에게 많은 성능을 요할 것입니다 ... –

+0

그래, 내가 다른 방법으로 알고 있니? – sanu

+0

디 바운싱은 성능 문제를 해결할 것입니다 ... https://lodash.com/docs/4.16.4#debounce –

답변

2

나는 당신이

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 = []; 

은 다음 함수 값이 전달 컨트롤러의 배열을

다음으로 $ 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){ 

      } 
    } 
}) 
}