angular使用NZ的日期选择器时，onChange更改日期格式，自动进行上百次调用爆栈。

Question

问题描述

表单中使用nz时间选择器：

<nz-date-picker (ngModelChange)="onChange($event)" >
    </nz-date-picker>

需要将表单中的日期进行格式化后传回后端
component.ts中：

onChange(result: Date): void {
        console.log('onChange: ', result);
        if (result) {
        //更改表单数据
          this.validateForm.patchValue({ useDate: this.datePipe.transform(result, 'yyyy-MM-dd') });
          console.log(this.validateForm.value);
        }

}

出现的情况

如果不更改表单数据只控制台输出result就不会出现这样的情况
为什么会出现这样的情况呢？
有没有更好的方式处理日期的格式？

Answer 1

你patch value 之后表单内容被改变，又会触发onChange函数，你的问题在于在网页里修改了表单内容后，相应的用来储存表单的变量就已经改变了，不需要再用patchvalue去修改form的内容。

Answer 2

死循环啊大兄嘚,表单中时间改变触发onchange,onchange函数又去改变表单中的时间,时间被改变又出发onchange.
你应该将获取到的时间在点击提交,准备发送给后端的时候才转换时间格式,而不是乱用ngModelChange

Answer 3

nz-date-picker的model是Date类型，应该在表单提交的时候转换传给后端，不是在nz-date-picker的change事件中。