search

ng-matero / extensions

Angular Material Extensions Library.
https://ng-matero.github.io/extensions/
MIT License
393 stars 48 forks source link

MtxDateTimePicker with Moment using UTC breaks time selection #172

Closed MikaelGRA closed 1 year ago

MikaelGRA commented 1 year ago

We have a project where we are using the DateTimePicker component from this library. We are using it with the moment adapter with the useUtc option set to true in MAT_MOMENT_DATE_ADAPTER_OPTIONS.

When we do this we experience a strange issue where when we select the time component of the datetime by dragging the time picker around the clock that the date changes unexpectedly.

If we change the useUtc option of MAT_MOMENT_DATE_ADAPTER_OPTIONS to false, this issue ceases to exist and it works as expected. However, we would like this to work with UTC.

Untitled video - Made with Clipchamp (1)

nzbin commented 1 year ago

I will try to fix this issue. @JelleBruisten

JelleBruisten commented 1 year ago

Is this issue only within the moment adapter? or does the same issue exist in the other datetime adapters?

nzbin commented 1 year ago

Is this issue only within the moment adapter? or does the same issue exist in the other datetime adapters?

I tested it. There has also problems within luxon adapter.

pedroestabruxelles commented 1 year ago

Is there an estimated time to fix this? I was trying to integrate this on our project and have the same issue (v14)

nzbin commented 1 year ago

Is there an estimated time to fix this? I was trying to integrate this on our project and have the same issue (v14)

I'm sorry, I have tried to fix it but I found it's very hard to fix. I even don't know how to handle and display the current time and utc time in the component. I think you can handle the utc time by yourself or customize a component base on the time picker. Do you know any other library or example that has the utc option?

nzbin commented 1 year ago

For this issue, please don't use the useUtc option, just convert the input value after selected date time. Maybe I will add another utc prop for the datetimepicker.

pedroestabruxelles commented 1 year ago

Do you know any other library or example that has the utc option?

mat-datepicker?

JelleBruisten commented 1 year ago

In my project we use a wrapper around this datetime picker, which also adds a timezone option. It does this by a injection token which is injected into the adapter.

And every method of our datetime adapter makes sure it is in the correct timezone. I think a similar approach might work for you, by providing your own adapter ( extend the adapter and set the timezone correctly ).

I can provide a example later today

pranxy commented 1 year ago

In my project we use a wrapper around this datetime picker, which also adds a timezone option. It does this by a injection token which is injected into the adapter.

And every method of our datetime adapter makes sure it is in the correct timezone. I think a similar approach might work for you, by providing your own adapter ( extend the adapter and set the timezone correctly ).

I can provide a example later today

But to do that don't you need moment-timezone package?

nzbin commented 1 year ago

The new version of @ng-matero/extensions-moment-adapter and @ng-matero/extensions-luxon-adapter (15.0.1, 14.0.3) has fixed this issue, please have a try.

amerador20 commented 1 year ago

Hi, How can i set default datetime in mtx-datetimepicker componnet? I cant't find any method to do this.

Thanks!