如何在Angular2中使用Date对象检测更改？

Question

使用setDate方法修改的日期对象未在模板中更新.

在模板中:

<p>{{date | date:'mediumDate'}}</p>

在组件中:

  nextDay(){
    this.date.setDate(this.date.getDate()+1);
  }

但是当我调用nextDay函数时,模板不会使用新值更新.

我可以让变更检测工作的唯一方法是这样做:

  nextDay(){
    var tomorrow = new Date();
    tomorrow.setDate(this.date.getDate()+1);
    this.date = tomorrow;
  }

有没有更好的方法来完成同样的任务？

Answer 1

我认为这是改变日期变量引用的正确方法.从这里的文档我们有:

默认更改检测算法通过在更改检测运行之间通过引用比较绑定属性值来查找差异.

因此,如果日期参考保持不变,则不会发生任何事情.您需要一个新的日期参考,这就是第二个版本的nextDay()工作原因.

如果删除格式化管道,您将看到仍然只有第二个版本的nextDay()作品.