以下是使用Angular编写的一个示例代码,用于列出两个日期之间的所有天数:
import { Component } from '@angular/core';
@Component({
selector: 'app-date-list',
template: `
Date List
- {{ date | date:'mediumDate' }}
`
})
export class DateListComponent {
startDate: string;
endDate: string;
dateList: Date[];
listDates() {
this.dateList = [];
const start = new Date(this.startDate);
const end = new Date(this.endDate);
for (let d = start; d <= end; d.setDate(d.getDate() + 1)) {
this.dateList.push(new Date(d));
}
}
}
在这个示例中,我们创建了一个DateListComponent
组件,其中包含两个日期输入框和一个按钮。当用户选择了开始日期和结束日期并点击按钮时,listDates()
方法将被调用。
在listDates()
方法中,我们首先将开始日期和结束日期转换为Date
对象。然后使用一个循环来迭代从开始日期到结束日期的每一天,将每个日期添加到dateList
数组中。
最后,在模板中使用*ngFor
指令来遍历dateList
数组,并使用date
管道将日期格式化为可读的日期字符串。
这样,当用户选择开始和结束日期并点击按钮后,页面上将显示出两个日期之间的所有天数。
下一篇:Angular列可见性