javascript - 从 API 读取并比较日期以显示某些内容
问题描述
因此,这是关于使用具有日期/时间属性的 API。内容应每 3 小时更改一次,方法是将当前用户日期/时间与 API 的日期/时间进行比较,并在单独的数组中分配过去和即将到来的时间,以显示在页面的其他部分。我设法将过去和即将到来的日期分配给他们各自的数组。如果用户日期/时间等于或在属性中的 3 小时内,我需要比较日期并分配“当前数据”,以在整个三个小时的持续时间内显示它。
this.dataService.getData().subscribe((data:any[])=>{
const now = new Date('2021-02-14 09:00:00');
for (const item of data) {
const apiDate = new Date(item.dateTime);
if(now.getTime() > apiDate.getTime()){
this.future.push('future dates')
} else if(now.getTime() < apiDate.getTime()){
this.past.push('past dates')
}else if(now.getTime() == apiDate.getTime()){
//in real time, they'll only be equal for one second
this.current = 'Show NOW'
}
}
这是重新调整的 API/Json 数据的结构
[ { "number": 10, "dateTime": "2021-02-14 00:00:00" }, { "number": 20, "dateTime": "2021-02-14 03:00:00" }, { "number": 30, "dateTime": "2021-02-14 06:00:00" }, { "number": 40, "dateTime": "2021-02-14 09:00:00" }, { "number": 50, "dateTime": "2021-02-14 12:00:00" }]
一个更好的方法会更好。
谢谢
解决方案
如果您想显示范围内的时间,那么您可以创建一个带有时间边界的对象:
getTimeInterval = () => {
const from = new Date();
const to = new Date(from);
to.setHours(to.getHours() + 3)
return { from, to };
}
然后只需检查日期from
和边界的两个边界to
:
this.dataService.getData().subscribe((data:any[])=>{
const dateRange = this.getTimeInterval();
for (const item of data) {
const apiDate = new Date(item.dateTime);
if (dateRange.from.getTime() > apiDate.getTime()
&& dateRange.to.getTime() > apiDate.getTime())
{
this.future.push('future dates');
}
else if(dateRange.from.getTime() < apiDate.getTime())
{
this.past.push('past dates')
}
else if (dateRange.from.getTime() >= apiDate.getTime()
&& dateRange.to.getTime() <= apiDate.getTime())
{
this.current = 'Show NOW'
}
}
推荐阅读
- javascript - 是否可以从 reactjs 向 expressjs 发送 post 请求并快速获取数据并使用 redux 将其发送回 reactjs?
- javascript - 在 32 位服务器上安装赛普拉斯
- javascript - 如何使用 React 在服务器端渲染中显示图像
- gtk - GTK:如何解决此问题:无法从 /org/gtk/libgtk/icons/16x16/status/image-missing.png 加载 pixbuf
- html - 如何在 CSS 中为特定 HTML 元素设置背景颜色而不影响子元素
- javascript - 评估条件并设置标志和值的最佳表达式
- c# - 如何为 Docker 中托管的 API 启用 HTTPS
- javascript - Node.js 错误 MissingSchemaError:尚未为模型“用户”注册模式。使用 mongoose.model(name, schema)
- javascript - React useRef 在路由更改时返回无法读取 null 属性“样式”的错误
- sql - 如何根据过滤条件选择行