错误 使用 setValue angular 4 时，位置 0 处缺少数字 [英] ERROR Missing number at position 0 when using setValue angular 4

问题描述

我正在使用 Angular 4 和 reactforms，momentjs 和 primeng 日历我'我想使用 setValue 并在包含日期的 reactForm 字段上尝试了 patchValue.此日期是通过 Primeng 日历创建的.

I'm using Angular 4 with reactiveforms, momentjs, and primeng calendar I'm tying to use setValue and have tried patchValue on a reactiveForm field which contains a Date. This date has been created via a primeng calendar.

购买日期:Sat Sep 02 2017 00:00:00 GMT+0100 (GMT Daylight Time)

我使用这个日期"来做一些事情，然后我使用 momentjs 将日期转换为准备好后端接受的干净格式(即 YYYY.MM.DD) 使用.moment().format(....

I use this 'date' to do a couple of things and then onSumbit of the form I convert the date using momentjs to a clean format ready for the backend to accept (i.e. YYYY.MM.DD) using.moment().format(....

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

However when I run the .setValue I'm getting the following console error ERROR Missing number at position 0 and can't figure out why.

// 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日历值时 - 由于某种原因不喜欢更改.

I have traced the issue down to when i try to set / patch the primeng calendar value - for some reason is doesn't like to be changed.

更新 monent 格式

setValue 上的问题接缝现在出现以下错误在 viewWrappedDebugError 位置 2 处出现意外文字

The issue seams to be happening on the setValue now getting the following error Unexpected literal at position 2 at viewWrappedDebugError

推荐答案

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

The thing is that PrimeNG date picker expects to receive instance of Date class as a value and it returns instance of a Date class as value. So that's why your attempts to put object of other types in there failed.

不清楚您为什么尝试在提交处理程序中调用 setValue().

It's not clear why you attempt to call setValue() in the submit handler.

如果您的目标是以编程方式修改值，请遵循 VincenzoC 在评论中的建议 - 修改对象并将其转换回 Date 对象，然后再将其传递给 setValue().

If your goal is to modify value programmatically follow suggestion from VincenzoC in comments - modify object and transform it back to Date object before passing it to 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 对象，您可以在提交之前以这种方式修改它:

If your goal is to format Date object for submitting to backend, you don't need to call setValue() at all. Format Date object to string and pass this string instead of Date object to the backend API. If you submitting whole value object from form you can modify it this way before submitting:

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

这篇关于错误 使用 setValue angular 4 时，位置 0 处缺少数字的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！