gpt4 book ai didi

javascript - 在 Angular 中输出第 3 列和第 5 列的总数之差

转载 作者:行者123 更新时间:2023-11-30 19:23:45 24 4
gpt4 key购买 nike

有什么办法可以得到第 3 列和最后一列的总和的差值吗?

<body ng-app="Test">
<section style="margin-top:80px">

<h3>Plastic Calculator Form Version 2.0</h3>

<div ng-controller="TestController as test" >
<p>To date,
<strong><u># of people who pledged</u></strong>
Earthlings have pledged to reduce
their single-use plastic waste from
<strong><u>{{ test.approve | sumByColumn: 'amount' }}</u>
</strong> Items per year to <strong>
<u>{{ test.approve | sumByColumn5: 'amount' }}</u>
</strong>.
That's a reduction of
<strong><u>{{ test.approve | sumByColumn4: 'reducedTotal' }}</u>
</strong> per year! Do your part. Make a pledge!
</p>
      <table class="table">
<tr>
<th>Single-Use Plastic Items</th>
<th>Enter the Number You Use Per Week</th>
<th>The Number You Use Per Year is:</th>
<th>How Many Less Can You Use Per Week?</th>
<th>Your Reduced Usage Per Year Would Be:</th>
</tr>

<tr ng-repeat="x in test.approve">
<td> {{ x.name }} </td>
<td> <input class="qty form-control" type="number"
ng-model="x.number" ng-change="sumByColumn3()" min="0"
restrict-to="[0-9]"/>
</td>
<td ng-model="x.amount"> {{ x.number*x.amount }} </td>
<td> <input class="qty form-control" type="number"
ng-model="x.reducedAmount" ng-change="sumByColumn2()"
min="0" restrict-to="[0-9]"/>
</td>
<td ng-model="x.reducedTotal"> {{ x.reducedAmount*x.reducedTotal }}
</td>
</tr>
<tr>
<td>TOTALS</td>
<td>{{ test.approve | sumByColumn3: 'number' }}</td>
<td>{{ test.approve | sumByColumn: 'amount' }}</td>
<td>{{ test.approve | sumByColumn2: 'reducedAmount' }}</td>
<td>{{ test.approve | sumByColumn4: 'reducedTotal' }}</td>
</tr>
</table>
      <form>
<div class="col-sm-4">
<div class="form-group">
<label for="full-name">Name</label>
<input type="text" class="form-control" id="full-name"
placeholder="Enter Full Name">
</div>
</div>
<div class="col-sm-4">
<div class="form-group">
<label for="email-address">Email</label>
<input type="email" class="form-control" id="email-address"
aria-describedby="emailHelp" placeholder="Enter email">
</div>
</div>
<div class="col-sm-4">
<button type="submit" class="btn btn-primary" style="margin-top:25px">
Submit
</button>
</div>
</form>
</div>
</section>

</body>

此外,有没有一种方法可以让表单在用户点击提交时在第 3 列中累积总数?换句话说,在它说的句子中:

single-use plastic waste from 
<strong>
<u>{{ test.approve | sumByColumn: 'amount' }}</u>
</strong> Items per year

每次用户填写表单时都会将总数加起来。

这是完整的代码 - https://codepen.io/tampham/pen/RzqLQV

至于获得差异,这是我目前尝试过的方法。

filter('sumByColumn5', function () {
return function (collection, column) {
var total = 0;

collection.forEach(function (item) {
total += (item.amount-item.reducedTotal);
});

return total;
};
})

任何建议都会有很大帮助,谢谢!

最佳答案

您已经有了以下行来计算第 3 列和第 5 列的总数

{{(test.approve | sumByColumn: 'amount') }} 
{{(test.approve | sumByColumn4: 'reducedTotal')}}

我认为对您来说最简单的解决方案是使用以下方法区分这两者。

{{(test.approve | sumByColumn: 'amount') - (test.approve | sumByColumn4: 'reducedTotal')}}

Demo

关于javascript - 在 Angular 中输出第 3 列和第 5 列的总数之差,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57151308/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com