如何计算Angularjs中的两个表的总和值?
How to Calculate Two Tables Totalsum Value in Angularjs?
我在我的应用程序中使用 MEAN 堆栈,AngularJS 作为我的前端。如何求和 angularjs 中的两个值,实际上我们有两个 table,第一个 table 用 filter:{raised: 'false'}
过滤,第二个 table 用 [= 过滤15=] 并且我们在 commision
中得到了 table 的总和值,然后我期望计算 commision
总和值,例如 A + B
作为 45 + 19 answer = 64
...My Plunker.
我们有两个table所以我想计算第一个tablecommision
总和值和第二个tablecommision
总和价值.
这两个 table 都使用 ng-module 值过滤 例如 :- 首先 table 使用 [= 过滤14=] 和第二个 table 用 filter:{raised: 'true'}
过滤
期望示例:- 第一个 table 佣金是 45
,第二个 table 佣金是 19
,我们需要计算这些值第三个 table 喜欢 A + B
答案应该是 64
.
我已经给了plunker作为参考plunker请知道解决方案的人帮助我们。
我的控制器:-
佣金总和过滤器:-
.filter('totalSumCV', function () {
return function (data, key1, key2) {
if (angular.isUndefined(data) && angular.isUndefined(key1) && angular.isUndefined(key2))
return 0;
var sum = 0;
angular.forEach(data,function(v,k){
sum = sum + (parseFloat(v[key1]) * parseFloat(v[key2])/100);
});
return sum.toFixed(2);
}
})
我的Html:-
<tr ng-repeat="mani in resultValue=(sryarndebitnote | filter:{raised: 'false'} )">
<td>A = {{resultValue | totalSumCV:'invoice_value_fob':'percentage_commission'}}</td>
</tr>
<tr ng-repeat="mani in resultValue=(sryarndebitnote | filter:{raised: 'true'} )">
<td>B = {{resultValue | totalSumCV:'invoice_value_fob':'percentage_commission'}}</td>
</tr>
我已经尝试计算两个 table 佣金总和值,例如:-
<td >C = {{((resultValue | totalSumCV:'invoice_value_fob':'percentage_commission') * 1) + ((resultValue | totalSumCV:'invoice_value_fob':'percentage_commission')*1)}}</td>
你应该为结果集不同的变量来实现这个,
这是您需要的答案,
var app = angular.module('plunker', []);
app.filter('sumOfValue', function () {
return function (data, key) {
debugger;
if (angular.isUndefined(data) && angular.isUndefined(key))
return 0;
var sum = 0;
angular.forEach(data,function(v,k){
sum = sum + parseFloat(v[key]);
});
return sum.toFixed(2);
}
}).filter('totalSumCV', function () {
return function (data, key1, key2) {
if (angular.isUndefined(data) && angular.isUndefined(key1) && angular.isUndefined(key2))
return 0;
var sum = 0;
angular.forEach(data,function(v,k){
sum = sum + (parseFloat(v[key1]) * parseFloat(v[key2])/100);
});
return sum.toFixed(2);
}
}).controller('MainCtrl', function($scope) {
$scope.sryarndebitnote = [
{
"_id": "57ecb2861365a8150a34c660",
"user": {
"_id": "57400c32bd07906c1308e2cf",
"displayName": "mani selvam"
},
"__v": 0,
"created": "2016-09-29T06:19:50.046Z",
"shipment_id": "57dc0ad6a752016f1638c6bc",
"raised": false,
"conversion_rate": "62",
"percentage_tds": "10",
"percentage_servicetax": "15",
"percentage_commission": "3",
"invoice_value_fob": "300",
"invoice_value_cif": "50",
"invoice_quantity": "40",
"supplier_name": "asd",
"buyer_name": "Rohit"
},
{
"_id": "57ecb2861365a8150a34c660",
"user": {
"_id": "57400c32bd07906c1308e2cf",
"displayName": "mani selvam"
},
"__v": 0,
"created": "2016-09-29T06:19:50.046Z",
"shipment_id": "57dc0ad6a752016f1638c6bc",
"raised": false,
"conversion_rate": "62",
"percentage_tds": "10",
"percentage_servicetax": "15",
"percentage_commission": "6",
"invoice_value_fob": "600",
"invoice_value_cif": "50",
"invoice_quantity": "40",
"supplier_name": "asd",
"buyer_name": "Rohit"
},
{
"_id": "57ecb2861365a8150a34c660",
"user": {
"_id": "57400c32bd07906c1308e2cf",
"displayName": "mani selvam"
},
"__v": 0,
"created": "2016-09-29T06:19:50.046Z",
"shipment_id": "57dc0ad6a752016f1638c6bc",
"raised": true,
"conversion_rate": "62",
"percentage_tds": "10",
"percentage_servicetax": "15",
"percentage_commission": "4",
"invoice_value_fob": "400",
"invoice_value_cif": "50",
"invoice_quantity": "40",
"supplier_name": "asd",
"buyer_name": "Rohit"
},
{
"_id": "57ecb2861365a8150a34c660",
"user": {
"_id": "57400c32bd07906c1308e2cf",
"displayName": "mani selvam"
},
"__v": 0,
"created": "2016-09-29T06:19:50.046Z",
"shipment_id": "57dc0ad6a752016f1638c6bc",
"raised": true,
"conversion_rate": "62",
"percentage_tds": "10",
"percentage_servicetax": "15",
"percentage_commission": "3",
"invoice_value_fob": "100",
"invoice_value_cif": "50",
"invoice_quantity": "40",
"supplier_name": "asd",
"buyer_name": "Rohit"
},]
});
/* Put your css in here */
body {
font-size: 14px;
}
table
{
border-collapse:collapse;
}
table, td, th
{
border:1px solid black;
}
td{
padding: 2px;
}
.servicetaxinclusivetrue:before{
color: green!important;
content: "\f00c";
}
.servicetaxinclusivefalse:before{
color: red!important;
content: "\f00d";
}
.servicetaxexclusivetrue:before{
color: green!important;
content: "\f00c";
}
.servicetaxexclusivefalse:before{
color: red!important;
content: "\f00d";
}
.margin{
margin-top: 20px;
}
<!DOCTYPE html>
<html ng-app="plunker">
<head>
<meta charset="utf-8" />
<title>AngularJS Plunker</title>
<script>document.write('<base href="' + document.location + '" />');</script>
<link rel="stylesheet" href="style.css" />
<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.3/css/font-awesome.min.css">
<script data-require="angular.js@1.4.x" src="https://code.angularjs.org/1.4.12/angular.js" data-semver="1.4.9"></script>
<script src="app.js"></script>
</head>
<body ng-controller="MainCtrl">
<table ng-table="tableParams" class="table table-bordered ">
<thead>
<tr>
<th rowspan="2"> S.No </th>
<th rowspan="2"> fob </th>
<th rowspan="2"> Commision </th>
<th rowspan="2">Quantity</th>
</tr>
</thead>
<tr ng-repeat="mani in resultValue=(sryarndebitnote | filter:{raised: 'false'} )">
<td >{{$index + 1}}</td>
<td >{{mani.invoice_value_fob}}</td>
<td >{{(mani.invoice_value_fob * (mani.percentage_commission / 100)) | number:2}}</td>
<td >{{mani.invoice_quantity}}</td>
</tr>
<tr>
<td>sum</td>
<td>{{resultValue | sumOfValue:'invoice_value_fob'}}</td>
<td>A = {{resultValue | totalSumCV:'invoice_value_fob':'percentage_commission'}}</td>
<td></td>
</tr>
</table>
<table ng-table="tableParams" class="margin table table-bordered ">
<thead>
<tr>
<th rowspan="2"> S.No </th>
<th rowspan="2"> fob </th>
<th rowspan="2"> Commision </th>
<th rowspan="2">Quantity</th>
</tr>
</thead>
<tr ng-repeat="mani in resultValue2=(sryarndebitnote | filter:{raised: 'true'})">
<td >{{$index + 1}}</td>
<td >{{mani.invoice_value_fob}}</td>
<td >{{(mani.invoice_value_fob * (mani.percentage_commission / 100)) | number:2}}</td>
<td >{{mani.invoice_quantity}}</td>
</tr>
<tr>
<td>sum</td>
<td>{{resultValue2 | sumOfValue:'invoice_value_fob'}}</td>
<td>B = {{resultValue2 | totalSumCV:'invoice_value_fob':'percentage_commission'}}</td>
<td></td>
</tr>
</table>
<table ng-table="tableParams" class="margin table table-bordered ">
<thead>
<tr>
<th rowspan="2"> S.No </th>
<th rowspan="2"> A + B </th>
</tr>
</thead>
<td >{{resultValue2 | totalSumCV:'invoice_value_fob':'percentage_commission'}}</td>
<td >C = {{((resultValue | totalSumCV:'invoice_value_fob':'percentage_commission') * 1) + ((resultValue2 | totalSumCV:'invoice_value_fob':'percentage_commission')*1)}}</td>
</table>
</body>
</html>
请运行代码。
我在我的应用程序中使用 MEAN 堆栈,AngularJS 作为我的前端。如何求和 angularjs 中的两个值,实际上我们有两个 table,第一个 table 用 filter:{raised: 'false'}
过滤,第二个 table 用 [= 过滤15=] 并且我们在 commision
中得到了 table 的总和值,然后我期望计算 commision
总和值,例如 A + B
作为 45 + 19 answer = 64
...My Plunker.
我们有两个table所以我想计算第一个table
commision
总和值和第二个tablecommision
总和价值.这两个 table 都使用 ng-module 值过滤 例如 :- 首先 table 使用 [= 过滤14=] 和第二个 table 用
filter:{raised: 'true'}
过滤
期望示例:- 第一个 table 佣金是
45
,第二个 table 佣金是19
,我们需要计算这些值第三个 table 喜欢A + B
答案应该是64
.我已经给了plunker作为参考plunker请知道解决方案的人帮助我们。
我的控制器:- 佣金总和过滤器:-
.filter('totalSumCV', function () {
return function (data, key1, key2) {
if (angular.isUndefined(data) && angular.isUndefined(key1) && angular.isUndefined(key2))
return 0;
var sum = 0;
angular.forEach(data,function(v,k){
sum = sum + (parseFloat(v[key1]) * parseFloat(v[key2])/100);
});
return sum.toFixed(2);
}
})
我的Html:-
<tr ng-repeat="mani in resultValue=(sryarndebitnote | filter:{raised: 'false'} )">
<td>A = {{resultValue | totalSumCV:'invoice_value_fob':'percentage_commission'}}</td>
</tr>
<tr ng-repeat="mani in resultValue=(sryarndebitnote | filter:{raised: 'true'} )">
<td>B = {{resultValue | totalSumCV:'invoice_value_fob':'percentage_commission'}}</td>
</tr>
我已经尝试计算两个 table 佣金总和值,例如:-
<td >C = {{((resultValue | totalSumCV:'invoice_value_fob':'percentage_commission') * 1) + ((resultValue | totalSumCV:'invoice_value_fob':'percentage_commission')*1)}}</td>
你应该为结果集不同的变量来实现这个,
这是您需要的答案,
var app = angular.module('plunker', []);
app.filter('sumOfValue', function () {
return function (data, key) {
debugger;
if (angular.isUndefined(data) && angular.isUndefined(key))
return 0;
var sum = 0;
angular.forEach(data,function(v,k){
sum = sum + parseFloat(v[key]);
});
return sum.toFixed(2);
}
}).filter('totalSumCV', function () {
return function (data, key1, key2) {
if (angular.isUndefined(data) && angular.isUndefined(key1) && angular.isUndefined(key2))
return 0;
var sum = 0;
angular.forEach(data,function(v,k){
sum = sum + (parseFloat(v[key1]) * parseFloat(v[key2])/100);
});
return sum.toFixed(2);
}
}).controller('MainCtrl', function($scope) {
$scope.sryarndebitnote = [
{
"_id": "57ecb2861365a8150a34c660",
"user": {
"_id": "57400c32bd07906c1308e2cf",
"displayName": "mani selvam"
},
"__v": 0,
"created": "2016-09-29T06:19:50.046Z",
"shipment_id": "57dc0ad6a752016f1638c6bc",
"raised": false,
"conversion_rate": "62",
"percentage_tds": "10",
"percentage_servicetax": "15",
"percentage_commission": "3",
"invoice_value_fob": "300",
"invoice_value_cif": "50",
"invoice_quantity": "40",
"supplier_name": "asd",
"buyer_name": "Rohit"
},
{
"_id": "57ecb2861365a8150a34c660",
"user": {
"_id": "57400c32bd07906c1308e2cf",
"displayName": "mani selvam"
},
"__v": 0,
"created": "2016-09-29T06:19:50.046Z",
"shipment_id": "57dc0ad6a752016f1638c6bc",
"raised": false,
"conversion_rate": "62",
"percentage_tds": "10",
"percentage_servicetax": "15",
"percentage_commission": "6",
"invoice_value_fob": "600",
"invoice_value_cif": "50",
"invoice_quantity": "40",
"supplier_name": "asd",
"buyer_name": "Rohit"
},
{
"_id": "57ecb2861365a8150a34c660",
"user": {
"_id": "57400c32bd07906c1308e2cf",
"displayName": "mani selvam"
},
"__v": 0,
"created": "2016-09-29T06:19:50.046Z",
"shipment_id": "57dc0ad6a752016f1638c6bc",
"raised": true,
"conversion_rate": "62",
"percentage_tds": "10",
"percentage_servicetax": "15",
"percentage_commission": "4",
"invoice_value_fob": "400",
"invoice_value_cif": "50",
"invoice_quantity": "40",
"supplier_name": "asd",
"buyer_name": "Rohit"
},
{
"_id": "57ecb2861365a8150a34c660",
"user": {
"_id": "57400c32bd07906c1308e2cf",
"displayName": "mani selvam"
},
"__v": 0,
"created": "2016-09-29T06:19:50.046Z",
"shipment_id": "57dc0ad6a752016f1638c6bc",
"raised": true,
"conversion_rate": "62",
"percentage_tds": "10",
"percentage_servicetax": "15",
"percentage_commission": "3",
"invoice_value_fob": "100",
"invoice_value_cif": "50",
"invoice_quantity": "40",
"supplier_name": "asd",
"buyer_name": "Rohit"
},]
});
/* Put your css in here */
body {
font-size: 14px;
}
table
{
border-collapse:collapse;
}
table, td, th
{
border:1px solid black;
}
td{
padding: 2px;
}
.servicetaxinclusivetrue:before{
color: green!important;
content: "\f00c";
}
.servicetaxinclusivefalse:before{
color: red!important;
content: "\f00d";
}
.servicetaxexclusivetrue:before{
color: green!important;
content: "\f00c";
}
.servicetaxexclusivefalse:before{
color: red!important;
content: "\f00d";
}
.margin{
margin-top: 20px;
}
<!DOCTYPE html>
<html ng-app="plunker">
<head>
<meta charset="utf-8" />
<title>AngularJS Plunker</title>
<script>document.write('<base href="' + document.location + '" />');</script>
<link rel="stylesheet" href="style.css" />
<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.3/css/font-awesome.min.css">
<script data-require="angular.js@1.4.x" src="https://code.angularjs.org/1.4.12/angular.js" data-semver="1.4.9"></script>
<script src="app.js"></script>
</head>
<body ng-controller="MainCtrl">
<table ng-table="tableParams" class="table table-bordered ">
<thead>
<tr>
<th rowspan="2"> S.No </th>
<th rowspan="2"> fob </th>
<th rowspan="2"> Commision </th>
<th rowspan="2">Quantity</th>
</tr>
</thead>
<tr ng-repeat="mani in resultValue=(sryarndebitnote | filter:{raised: 'false'} )">
<td >{{$index + 1}}</td>
<td >{{mani.invoice_value_fob}}</td>
<td >{{(mani.invoice_value_fob * (mani.percentage_commission / 100)) | number:2}}</td>
<td >{{mani.invoice_quantity}}</td>
</tr>
<tr>
<td>sum</td>
<td>{{resultValue | sumOfValue:'invoice_value_fob'}}</td>
<td>A = {{resultValue | totalSumCV:'invoice_value_fob':'percentage_commission'}}</td>
<td></td>
</tr>
</table>
<table ng-table="tableParams" class="margin table table-bordered ">
<thead>
<tr>
<th rowspan="2"> S.No </th>
<th rowspan="2"> fob </th>
<th rowspan="2"> Commision </th>
<th rowspan="2">Quantity</th>
</tr>
</thead>
<tr ng-repeat="mani in resultValue2=(sryarndebitnote | filter:{raised: 'true'})">
<td >{{$index + 1}}</td>
<td >{{mani.invoice_value_fob}}</td>
<td >{{(mani.invoice_value_fob * (mani.percentage_commission / 100)) | number:2}}</td>
<td >{{mani.invoice_quantity}}</td>
</tr>
<tr>
<td>sum</td>
<td>{{resultValue2 | sumOfValue:'invoice_value_fob'}}</td>
<td>B = {{resultValue2 | totalSumCV:'invoice_value_fob':'percentage_commission'}}</td>
<td></td>
</tr>
</table>
<table ng-table="tableParams" class="margin table table-bordered ">
<thead>
<tr>
<th rowspan="2"> S.No </th>
<th rowspan="2"> A + B </th>
</tr>
</thead>
<td >{{resultValue2 | totalSumCV:'invoice_value_fob':'percentage_commission'}}</td>
<td >C = {{((resultValue | totalSumCV:'invoice_value_fob':'percentage_commission') * 1) + ((resultValue2 | totalSumCV:'invoice_value_fob':'percentage_commission')*1)}}</td>
</table>
</body>
</html>
请运行代码。