使用 setValue angular 4 时，错误在位置 0 处缺少数字

Question

我正在使用 Angular 4 with reactiveforms, momentjs, and primeng calendar 我打算使用 setValue 并尝试 patchValue 在包含日期的 reactiveForm 字段上。此日期是通过 primeng 日历创建的。

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

我使用这个 'date' 做一些事情然后 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 日历值时 - 由于某种原因不喜欢更改。

已更新 货币格式

问题似乎发生在 setValue 上，现在出现以下错误 Unexpected literal at position 2 at viewWrappedDebugError

Answer 1

问题是 PrimeNG 日期选择器希望接收 Date class 的实例作为值，它 returns Date class 的实例作为价值。这就是为什么您尝试将其他类型的对象放入其中失败的原因。

不清楚您为何尝试在提交处理程序中调用 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);

Answer 2

我遇到了类似的问题，我注意到我试图以错误的顺序提供 PrimeNG 日期：

{date: "2018-01-31"} - works perfectly fine,
{date: "31-01-2018"} - ERROR Missing number at position 0

就像我的情况一样简单。

使用 setValue angular 4 时，错误在位置 0 处缺少数字

ERROR Missing number at position 0 when using setValue angular 4

javascript

angular

momentjs

primeng

angular-reactive-forms