Angular-Date管道在ngFor中使用时不会更新值

我有一个angular项目，其中有一个ngFor，我想用angular的日期管道显示值

<tr *ngFor="let p of months"> 
         <td>{{ p.month | date:'LLLL' }}</td>
</tr>

但是如果我添加这个，现在我的页面加载为空白，没有控制台错误，只有一个空白页面页面页面的第一个元素是ngFor，如果我在此之前添加一个带字符串的简单div，它将正确显示

那么为什么ChangeDetection会破坏我的页面？如何在ngFor中正确使用角度日期管道？

您应该将日期实例传递到日期管道中

在您的模型中，您可以执行以下操作：

monthDates: Date[];

ngOnInit(): void {
  // this goes after wherever you are currently setting your months. 
  // I have used ngOnInit for demonstration purposes
  this.monthDates = this.months.map(m => new Date(1970, m - 1, 1));
}

然后在html中使用日期实例：

<tr *ngFor="let p of monthDates"> 
  <td>{{ p | date:'LLLL' }}</td>
</tr>

我假设您的月份数组是基于1的-1=一月，2=二月，等等。

---

请记住，javascript日期对象中的月份是基于0的-0=一月、1=二月等。

1、2、3不是日期实例。DatePipe将把1解释为新的Date1，即1970年1月1日。为了理解为什么使用OnPush策略会破坏您的代码，我们需要整个应用程序。你可以试着使用ngZone和runoutsideangular，看看这是否解决了问题。自从AngularJS之后，他们改变了这个吗？当我在AngularJS中以这种方式使用这个管道时，有一个数字，它曾经工作过！我会试试你的解决办法我从没用过angularJS。但最好将它们视为不同的框架！如果是这样的话，行为会发生有趣的变化。是的，这确实是问题所在，现在问题已经解决了，我不知道你必须将日期对象传递到日期管道中，使用AngularJS你可以传递一个整数

<tr *ngFor="let p of monthDates"> 
  <td>{{ p | date:'LLLL' }}</td>
</tr>