时间戳

首页 > 解决方案 > Angular 7 - *ngFor 在单个 p 标签中计算并绑定过去 3 天的时间

angular - Angular 7 - *ngFor 在单个 p 标签中计算并绑定过去 3 天的时间

问题描述

我想使用 angular 在单个 p 标签中计算并显示最后 3 天的剩余时间

<p>You have remaining time <span *ngFor="let item of _objAttendancePage.Attendancelist">{{item.remainingTime}}</span>  to complete your working hour. Do you want to still punch out ?|</p>

在上面运行此代码后，输出如下所示：您还有剩余时间 00:25:20,00:30:25,00:40:15 分钟来完成您的工作时间。你还要打吗？

I expect if user logout his session before working hrs completed(last 3 days)

Employee Remaining Time List (Attendancelist: array):
1st Day: 00:25:20,
2nd Day: 00:30:25,
3rd Day: 00:40:15,
4th Day: 01:50:15 and so on

我希望最终输出是：

You have remaining time 95Min to complete your working hour. Do you want 
to still punch out ?

标签： angulartypescript

解决方案

根据我的理解，您想将“出席列表”中的所有最小值相加，然后显示最终的总和值。

您应该为此使用 Angular Pipe。会是这样的

<p>You have remaining time 
<span >{{_objAttendancePage.Attendancelist|sum}}</span>  
to complete your working hour. Do you want to still punch out ?|</p>

这里的“|sum”是您需要创建的管道。参考这个https://angular.io/guide/pipes#custom-pipes

推荐阅读