search

dalelotts / angular-bootstrap-datetimepicker

Native Angular date/time picker component styled by Twitter Bootstrap
http://dalelotts.github.io/angular-bootstrap-datetimepicker/
MIT License
1.28k stars 409 forks source link

Add ability to override default display format per `DlDateTimeInputDirective` #468

Closed byronantak closed 4 years ago

byronantak commented 4 years ago

Please describe the feature you would like to request.

I would like a way to control the format of the date that is displayed on the date picker after a date has been selected

What is the use-case or motivation for this proposal?

We want to standardize the way dates are displayed in our current system but the datepicker does not allow us to change the display of the selected date (which does not match our system standard)

Is there anything else I should know?

No

dalelotts commented 4 years ago

https://github.com/dalelotts/angular-bootstrap-datetimepicker#display-of-year-month-day-hour-ampm-and-minute-formats

byronantak commented 4 years ago

I suppose that I should have given more context here, I apologize. Our system is using the date time picker as both a date picker and a date-time picker. We want to standardize the dates but we also want to disable the time display components where the min view is day (no time selection required).

Unfortunately we have date-time pickers and date pickers on the same page, so changing locale settings between pages is not all that viable.

dalelotts commented 4 years ago

It's difficult to visualize what you are trying to accomplish. Can you put up a Stackblitz or other live site demonstrating the problem you are trying to solve?

byronantak commented 4 years ago

I created a basic Stackblitz example to demonstrate this. I included descriptions by the fields to try explain what I was saying earlier https://stackblitz.com/edit/angular-ivy-s1otuu

dalelotts commented 4 years ago

Thank you! I understand now.

dalelotts commented 4 years ago

I'm swamped with work at the moment, so I don't have time to fork and update your example.

However, I'm 99% sure there are no code changes needed for this. Move the code into a separate component and use the element level dependency injector to supply the format you want.

byronantak commented 4 years ago

Thank you for the reply 😄

I did not know that you can override dependency tokens tokens in a non-global way. I will fork my own StackBlitz and make the changes and post it here so that anyone else who finds the issue has a solution

byronantak commented 4 years ago

I created a fork from my StackBlitz which I implemented the fix as suggested. Thanks again https://stackblitz.com/edit/angular-ivy-2lghv4

dalelotts commented 4 years ago

I'm glad it worked!

If you have time and interest, a PR to the demo project to add an example showing how to implement and test this would be great.