Angular 4 Typescript - 构建后续7天的日期数组

Question

我想构建一个包含7个日期的数组。这些日期将是SelectedDate的后续7天。我在Component.ts中编写了以下代码

public selectedWeekDates: Date [];

public selectedWeek: Date = new Date();

SetSelectedWeekDates(): void {
    var dte = new Date();
    dte = this.selectedWeek;
    for (let i: number = 1; i < 8; i++) {            
        this.selectedWeekDates[i - 1].setDate(dte.getDate() + i);
    }

}

我的HTML如下

.
.
.
<ng-container *ngFor="let dates of selectedWeekDates">
    <div style="padding: 10px;">
        {{ dates| date:"dd" }}
    </div>
</ng-container>
.
.
.

我在控制台中遇到错误

TypeError：无法在xxxComponent.prototype.SetSelectedWeekDates（eval代码：179：143）获取未定义或空引用的属性“0”

我可以知道我的代码有什么问题吗？

Answer 1

在你的函数中，你在setDate的元素上使用this.selectedWeekDates函数，而它们是未定义的。您应该使用this.selectedWeek或dte来获取和设置日期，如下所示：

SetSelectedWeekDates(): void {
    let dte: Date = new Date(this.selectedWeek);        
     for (let i = 1; i < 8; i++) {            
        this.selectedWeekDates[i-1]=new Date(dte.setDate(dte.getDate() + 1));
        }

}

而不是在getDate（）之后添加i，如上所述添加1，因为setDate（）函数在每次迭代中将dte递增一天，这意味着每次迭代后都会更新dte。

Answer 2

你的selectedWeekDates是空的。因此错误。尝试修复它：

public selectedWeekDates: Date[] = new Array(7).fill(new Date());

public selectedWeek: Date = new Date();

SetSelectedWeekDates(): void {
    var dte = new Date();
    dte = this.selectedWeek;
    for (let i: number = 1; i < 8; i++) {            
        this.selectedWeekDates[i - 1].setDate(dte.getDate() + i);
    }

}

这应该可以解决您正在获得的当前错误。我不太确定你想要在这里实现什么。所以你可能需要修改一下你的逻辑。我能在屏幕上看到的只有27,7次。

这是你的参考的Sample StackBlitz。