#ngx-formly v6: Datepicker - How to force output to be a timestamp (number)

37 messages · Page 1 of 1 (latest)

vapid coral
#

Hi, pretty much self explanatory question in the title, I am using Angular v18 along with ngx-formly v6 and noticed that I can't set the output / parse to be a timestamp (number) instead of a Date object as the input field will become invalid.

Any suggestion / fix is welcomed as I need the timestamp in my forms to be sent to the backend.

An alternative solution would be manually doing date_field.getTime() with all forms that make use of the datepicker T.T

Stackblitz: https://stackblitz.com/edit/hmpuzh-ap9gwqvp?file=src%2Fapp%2Fapp.component.ts

lapis notch
#

Is updating the backend an option? As that looks like the better solution.

#

Anyway, I think you need a date adapter.

#

At this line, it seems to be saying that the value is not valid. And that happens through the adapter.

vapid coral
lapis notch
#

Why not ?

#

Where do u see it uses that ?

#

I missed that when diving in the source code this morning

vapid coral
#

Yikes, I didn't replace the MatNative adapter at the stackblitz for the date-fns one

#

But it behaves the same in terms of "value not valid"

#

So the question is: how to customize the provided date adapter?

lapis notch
#

You just said you know how to

#

I am confused.

#

You know how to change from native to date fns ?

vapid coral
#

Yes, the import at app.module.ts, but that doesn't solve the issue of output timestamp (number) instead of a date.

lapis notch
#

Why not ?

#

it looks like that does not accept a number

#

so it will fail validation

#

making the form never valid.

#

So you want to write your own adapter.

#

Anyway, just fix your backend like you should and treat dates like you should 😄

vapid coral
lapis notch
#

Sorry I do not speak spanish, what do u mean ?

vapid coral
#

My backend uses firestore, which makes use of timestamp for storing dates.

#

Guess I will go and copy/paste the angular date-fns adapter and try to make it accept numbers as well

#

Which should be the case because date-fns also works with numbers

#

Or worst case, just invoke the getTime at most forms outputs that use it

lapis notch
#

I can not believe that that means you need to send a number?

#

Can u not use that ?

vapid coral
#

That's a better option, didn't know 😄

vapid coral
#

Just in case, I have updated the stackblitz url to use the datefns adapter and angular 18. 🙂

vapid coral
#

@lapis notch I managed to solve it by overriding the deserialize method with a custom adapter