当组件属性取决于当前日期时间时，如何管理Angular2“检查后表达式已更改”异常

小编典典

当组件属性取决于当前日期时间时，如何管理Angular2“检查后表达式已更改”异常

all

我的组件具有取决于当前日期时间的样式。在我的组件中，我有以下功能。

  private fontColor( dto : Dto ) : string {
    // date d'exécution du dto
    let dtoDate : Date = new Date( dto.LastExecution );

    (...)

    let color =  "hsl( " + hue + ", 80%, " + (maxLigness - lightnessAmp) + "%)";

    return color;
  }

lightnessAmp从当前日期时间计算。如果dtoDate在过去 24 小时内，颜色会发生变化。

确切的错误如下：

检查后表达式已更改。以前的值：’hsl(123, 80%, 49%)’。当前值：’hsl(123, 80%, 48%)’

我知道只有在检查值时才会在开发模式下出现异常。如果检查的值与更新的值不同，则抛出异常。

所以我尝试在下面的钩子方法中更新每个生命周期的当前日期时间，以防止出现异常：

  ngAfterViewChecked()
  {
    console.log( "! changement de la date du composant !" );
    this.dateNow = new Date();
  }

…但没有成功。

阅读 56

2022-06-25

共1个答案

小编典典

更改后显式运行更改检测：

import { ChangeDetectorRef } from '@angular/core';

constructor(private cdRef:ChangeDetectorRef) {}

ngAfterViewChecked()
{
  console.log( "! changement de la date du composant !" );
  this.dateNow = new Date();
  this.cdRef.detectChanges();
}

2022-06-25