ERROR使用setValue angular 4时缺少位置0处的数字

Question

我正在使用Angular 4 with reactiveforms,momentjs和primeng calendar我正在使用setValue并尝试使用patchValue包含Date的reactiveForm字段.此日期已通过primeng日历创建.

purchaseDate: Sat Sep 02 2017 00:00:00 GMT+0100 (GMT Daylight Time)

我使用这个'日期'做了几件事,然后onSumbit的形式我把日期转换momentjs成一个干净的格式准备后端接受(即YYYY.MM.DD)使用.moment().format(....

但是,当我运行时,.setValue我得到以下控制台错误ERROR Missing number at position 0,无法弄清楚原因.

// convert the date
let newDate = moment(this.form.get('purchaseDate').value).format('YYYY.MM.DD');
// let newDate = moment(this.form.get('purchaseDate')).format('YYYY.MM.DD');
// with or without .value - display the same below (2017.09.01)
console.log(newDate); // 2017.09.01
this.form.get('purchaseDate').setValue(newDate);

// if I create a seperate (empty) reactiveForms field to test against
this.form.get('testField').setValue(newDate) // this works fine

我已经将问题追溯到当我尝试设置/修补primeng日历值时 - 由于某种原因不喜欢被改变.

更新的 monent格式

现在在setValue上发生问题接收会出现以下错误 Unexpected literal at position 2 at viewWrappedDebugError

Answer 1

事实是PrimeNG日期选择器希望将Date类的实例作为值接收，并返回Date类的实例作为值。因此，这就是您尝试将其他类型的对象放入其中的尝试失败的原因。

目前尚不清楚为什么尝试调用setValue()提交处理程序。

如果您的目标是通过程序修改值，请遵循VincenzoC在注释中的建议-修改对象并将其转换回Date对象，然后再传递给setValue()。

let newDate: Date = moment(this.form.get('purchaseDate').value).add(5, 'days').toDate();
this.form.get('purchaseDate').setValue(newDate);

如果您的目标是格式化Date对象以提交给后端，则根本不需要调用setValue()。将Date对象格式化为字符串，然后将此字符串而不是Date对象传递给后端API。如果您value从表单提交整个对象，则可以在提交之前以这种方式进行修改：

let newDate: string = moment(this.form.get('purchaseDate').value).format('YYYY.MM.DD');
let dataForBackend = { ...this.form.value, purchaseDate: newDate };
this.myBackend.sendData(dataForBackend);