调用组件时定义变量

Question

我需要将Date定义为组件的@Input：

<progress [start]="new Date()"></progress>

我收到此错误：

  

解析器错误：[new Date（）]中第5列出现了意外的令牌“日期”

调用组件时如何定义变量值？

Answer 1

您不能在属性内创建/初始化和分配。

HTML

<progress [start]="getDate()"></progress>

班级

getDate(){
  return new Date()
}

这就是说，您可能不希望以这种方式使用它，因为这样会通过更改检测生成一个新的Date。您可能希望将属性的值保留在属性中：

班级

myDate= new Date(); // This could be either on the top of the class, either in ngOnInit. Avoid putting in the constructor

HTML

<progress [start]="myDate"></progress>

Answer 2

您必须在component.ts中初始化日期，例如ngOnInit：

myDate: Date;

ngOnInit() {
    this.myDate = new Date();
}

并在您的模板中使用它：

<progress [start]="myDate"></progress>