ng-zorro-antd Datepicker 赋值的问题

Question

• 我的程序执行逻辑是这样的：
• 在程序开启时初始化日期变量，然后赋值给表单中的属性，然后使用 console.log()打印表单数据
• 打印出的表单数据中是有日期的，但是前端 HTML 中没有显示日期

• 我通过下面的方式在初始化表单时候给日期赋值

  this.mainForm = this.fb.group({
        id:[null],
        codeid: [null],
        billdate: [billdate, [Validators.required]],
        deliverytime:[deliverytime,[Validators.required]],
      });
  

• 看看在 console 中截图的效果

• 看到表单明明赋值成功了，为什么前端没有显示呢？

Answer 1

我也遇到这问题了，追踪老半天发现问题。
看下面AbstractPickerComponent中代码片段，惊不惊喜，意不意外？
意味着ngOnInit执行之前的赋值全部都是无效的！
在ngOnInit之前,FormControl设置的初始值在FormGroupDirective、FormControlName某个处理阶段就已经执行了ControlValueAccessor.writeValue

initValue(): void {
    this.nzValue = this.isRange ? [] : null;
}
ngOnInit(): void {
    // Subscribe the every locale change if the nzLocale is not handled by user
    if (!this.nzLocale) {
      this.i18n.localeChange.pipe(takeUntil(this.destroyed$)).subscribe(() => this.setLocale());
    }

    // Default value
    this.initValue();
}

Answer 2

我觉得有两种可能:

1.date格式不正确。

2.异步事件导致渲染不同步。数据改变了，但是没有触发Angular的脏检查，可以试一下，数据获取后用NgZone强制渲染试试