TypeScript(Angular)计算两个日期间隔得到HH:mm:ss格式时长问题

你错误地将时间戳差值（时长）作为时间点传入Date构造函数：new Date(差值毫秒数)实际得到的是1970年1月1日 00:00:00 UTC + 差值毫秒数对应的时间点，受你本地时区（UTC+1）影响，该时间点的本地显示会多1小时，这就是你得到1:0:19/01:00:19的根本原因。

方案1：手动计算时长（推荐，不受时区影响、支持超过24小时的间隔） #

直接通过毫秒差值换算时分秒，再补前导零即可：

if (end == null) {
  return "";
}
const startDate: Date = new Date(start);
const endDate: Date = new Date(end);
// 计算总毫秒差，取非负值避免结束时间早于开始时间的异常
const diffMs = Math.abs(endDate.getTime() - startDate.getTime());
// 换算时分秒
const totalSeconds = Math.floor(diffMs / 1000);
const hours = Math.floor(totalSeconds / 3600);
const minutes = Math.floor((totalSeconds % 3600) / 60);
const seconds = totalSeconds % 60;
// 补前导零后拼接
const pad = (num: number) => num.toString().padStart(2, '0');
return `${pad(hours)}:${pad(minutes)}:${pad(seconds)}`;

该方案计算你的示例输入，会直接返回00:00:19，完全符合预期。

方案2：修正DatePipe用法（仅适用于间隔小于24小时的场景） #

如果要继续使用Angular的DatePipe，只需在格式化时指定时区为UTC即可，避开本地时区偏移的影响：

const startDate: Date = new Date(start);
const endDate: Date = new Date(end);
if (end == null) {
  return "";
}
const duration = new Date(endDate.getTime() - startDate.getTime());
const datepipe: DatePipe = new DatePipe('en-US');
// 第三个参数指定时区为UTC
return datepipe.transform(duration, 'HH:mm:ss', 'UTC') || '';

如果你的时间间隔可能超过24小时，不要使用方案2：HH:mm:ss格式最多只能显示23小时59分59秒，超过的部分会被自动截断，方案1可以灵活扩展支持天级别的展示。

内容的提问来源于stack exchange，提问作者Stéphane GRILLON