Question

我正在使用Angular 4与反应形式，momentjs和primeng calendar我想要使用setValue并尝试patchValue在包含Date的reactiveForm字段上。此日期是通过primeng日历创建的。

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

我用这个＆＃39; date＆＃39;做一些事情，然后在形式的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);

Answer 2

我有类似的问题，我注意到我试图以错误的顺序给出PrimeNG日期：

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

就像我的情况一样容易。

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

2 个答案: