定期重新渲染角度组件

Question

我在更新显示的相对时间时遇到问题。

我有一个created_at字段，我将其通过管道输入，结果为立即， 1分钟前等。< / p>

代码看起来像这样

<div>{{ created_at | conversationTime }}</div>

现在，我想每分钟更新一次这些值，所以我做了

setPeriodicRefresh(minutes) {
    setInterval(() => {
      this.cdr.detectChanges();
    }, 1 * 1000 * 60);
  }

但是问题在于，如果有任何数据更改，角度变化检测就会起作用，在这种情况下，我的数据（即created_at）没有更改，而是由管道通过它生成的值。

任何人都可以帮我解决这个问题吗？

Answer 1

正如您所说，angular不会重新渲染管道，因为它可以记住结果。

默认情况下，角度使所有管道“纯”，这意味着它们是幂等的。

通过将管道更改为pure: false管道，它将在每次运行时运行。

@Pipe({
  ...
  pure: false
})

https://angular.io/guide/pipes#pure-and-impure-pipes

Answer 2

例如，只要组件角度变化中的任何属性值发生变化，

component.ts

time = 0;

ngOnInit() {
    setInterval(() => {
      this.time++;
    }, 1000)
}

component.html

<div>{{time}}</div>