Questions tagged [mat-datepicker]

Angular Material Date picker allows users to enter a date either through text input, or by choosing a date from the calendar. It is made up of several components and directives that work together.

Angular Material Date picker allows users to enter a date either through text input, or by choosing a date from the calendar. It is made up of several components and directives that work together.

128 questions
0
votes
1 answer

Is there any method to call a function on clicking a date in mat-datepicker other than dateChange in angular 9?

I need to call a function upon clicking a date in mat-datepicker. dateChange only calls a function if the selected date is changed. I need that function to be called if i click on the same date which is previously set. Is there any method to handle…
Vishnu .T.D
  • 43
  • 1
  • 10
0
votes
1 answer

how to change the color of today which is pre selected date mat-datepicker Angular

How to change the color of preselected today button in mat-datepicker
0
votes
1 answer

Disabling specific dates in Angular Material's [matDatepicker]

I am attempting to create an appointment booking application, and I am working on disabling certain dates. I have discovered a solution using the "matDatepickerFilter" feature. However, I am encountering an error when implementing it into my…
0
votes
0 answers

Date format changes when I take the focus off the input

I don't really know how to solve this problem, when I click on a datepicker to insert a new date and type , when I remove the focus the date format changes by itself. Video demonstration below: Date format change This is what i added to my project…
0
votes
0 answers

How to not allow null values in a mat-date-range-picker in angular

I am looking for a way to not allow null inputs for both the start and end dates in a mat date range picker. I am using mat-date-range-picker-actions so the dates are not applied until the user clicks the apply button. If one of the date selections…
0
votes
1 answer

Mat-Datepicker: how to use ja-JP Dateformat but keep english datepicker language

I want the date-format "YYYY/MM/DD" and therefore I use 'ja-JP' in my app.module providers: [ {provide: MAT_DATE_LOCALE, useValue: 'ja-JP'}, ] I get the right date-format "YYYY/MM/DD" but the datepicker is displayed in japanese. I would like…
user16405471
  • 61
  • 1
  • 7
0
votes
1 answer

How To Remove Underline of Angular Material Date Picker

I want to remove underline of Date Picker. By using inspect I did it but its not working by css. How can I do it by css ::ng-deep{ &.mdc-line-ripple::after{ border-bottom-style:none !important ; } }
Aabi
  • 1
0
votes
1 answer

How to remove the focus from mat-datepicker-toggle?

I want navigate with tab and instead of navigating to the toggle button, I want to navigate to the editable field. As the image below: I tried to find in the documentation an function or directive that disable the focusable from toggle-button, but…
0
votes
0 answers

mat-datepicker not working with formArray Angular

I'm working on a dynamic form in Angular. I'm using formArray and one of my field is mat-datepicker it is a formControl of my form. but when I'm trying to select date using date picker it is not working. I don't understand it is a Angular limitation…
Python29
  • 112
  • 6
0
votes
0 answers

How do I set DD/MM/AAAA 'es-ES' format to mat-date-input, for pick a date via keyboard?

I've been using `{ provide: MAT_DATE_LOCALE, useValue: 'es-ES' }` in my module to format the DatePicker of Angular material and it works for the picker, but when I try to write the date on 'ES' format (DD/MM/AAAA), it changes it to…
0
votes
1 answer

Bug in mat-datepicker when entering invalid input

I have the following code for a simple material datepicker:
Kees de Bruin
  • 175
  • 2
  • 16
0
votes
0 answers

NullInjectorError: R3InjectorError(AppModule)[MatDatepickerBase -> MatDatepickerBase -> MatDatepickerBase]: NullInjectorError:

i am trying to inser these 2 buttons but i get an error can you give me a solution Code:
Bilal S
  • 17
  • 7
0
votes
1 answer

Reactive mat-datepicker formatting using luxon

I'm trying to replace momentjs with luxonjs which is used in mat-datepicker of a reactive form, initially I'm loading the datepicker field with ISO format '2022-05-10T10:34:31.311-04:00' for which I used below luxon formatting to save the…
imPK
  • 764
  • 2
  • 7
  • 30
0
votes
1 answer

angular mat-select with ngModel binding opens dropdown at bottom of the screen

The below select element works fine.