Angular结合Ionic4开发时如何正确判断12:00am-6:59am时间区间

• 原逻辑对格式化后的时间字符串做大小比较，字符串按字典序排序，和实际时间先后逻辑完全不匹配，比对结果不可靠
• 判断条件使用&&连接两个阈值，逻辑等价于仅匹配≤12:00 am的时间点，00:01到06:59的核心区间完全被遗漏
• 额外书写问题：<ion-datetime>标签与[(ngModel)]属性之间缺少空格，建议补上避免模板解析异常

你要判断的12:00 am - 6:59 am区间，对应24小时制就是00:00到06:59，直接取时间的小时数值做判断即可，不需要转成带am/pm的字符串比对，逻辑最稳定。

基于moment的实现（和你现有技术栈匹配） #

首先修正模板代码：

<ion-datetime [(ngModel)]="data.laterTime"
           (ionChange)="saveDate($event)" displayFormat="HH:mm" min="00:00"
           max="23:59" hourValues="00,01,02,03,04,05,06,07,08,09,10,11,12,13,14,15,16,17,18,19,20,21,22,23" minuteValues="0, 15, 30, 45">
</ion-datetime>

TS逻辑修改为：

saveDate($event) {
  const selected = moment($event.detail?.value);
  // 取24小时制小时值，范围0-23
  const currentHour = selected.hour();
  // 小时值在0到6之间时，对应时间就是00:00-06:59，完全匹配目标区间
  if (currentHour >= 0 && currentHour < 7) {
    console.log("success!!!");
    // 此处编写区间匹配后的业务逻辑
  }
}

这个逻辑不受分钟配置影响，哪怕后续把分钟可选值调整为0-59全量可选，依然能准确覆盖到6:59的边界，7:00及之后的时间会被自动排除。

原生JS实现（无需moment依赖） #

如果不想依赖moment，可以直接解析组件返回的ISO时间字符串做判断：

saveDate($event) {
  const timeValue = $event.detail?.value;
  if (!timeValue) return;
  const selectedDate = new Date(timeValue);
  const currentHour = selectedDate.getHours();
  if (currentHour >= 0 && currentHour < 7) {
    console.log("success!!!");
  }
}

内容的提问来源于stack exchange，提问作者Fash