如何基于API请求构建可用的时隙周日历

Question

我想开发一个类似于每周视图中的日历的视图，并向我显示仍然可用的时间。我附上了一个截图，该截图应显示我将要做什么。现在要解决实际问题：我从外部API获取可用时隙的数据。但是，这只允许我获得某一天的时间。但我想显示接下来7天的可用时间。此外，API端点的参数中不支持日期范围。

日历的末尾显示如下：

现在，我的问题是实现这种观点的正确方法是什么？我是否应该每星期更改一次同时运行7个API查询？还是有其他解决方案？没有约会的日子应该被隐藏。

我正在使用Angular进行前端开发，所以，您有什么建议吗？

这是我在可用日期的API端点：

• https://developers.acuityscheduling.com/reference#get-availability-dates

这是可用时间的端点：

• https://developers.acuityscheduling.com/reference#get-availability-times