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
1
vote
1 answer

Angular 8: problem with mat-datepicker. I try to use [startAt] to forbid to choose a date before today

I have two datepicker in a Angular 8 form. I'd like to disable the dates before the date you use the form. But I don't find the solution. By default the selected date is today's date but I still can choose a date in the past. In…
ZenViKing
  • 11
  • 1
  • 2
1
vote
1 answer

Is there any way to fill the empty week days cells(previous and next months) in mat-datepicker and mat-calendar

I'm setting a calendar to Help users to select dates, but i want to fill the empty cells at the start of the first week with the previous and next months I'm using the Datepicker from Angular Material. hrer is a picture link explains more…
1
vote
1 answer

Attempted to open an MatDatepicker with no associated input

I have defined this MatDatePicker:
Usr
  • 2,628
  • 10
  • 51
  • 91
1
vote
1 answer

How to display changed date on material datepicker

I have this calendar that i want to display the default value of user's previously input date. However it does not display any value when I try to change the date. New date is still being able to save so I'm curious how to fix the displaying on data…
Monomoni
  • 415
  • 2
  • 4
  • 19
1
vote
1 answer

How to convert epoch format for form-control in matDatepicker

I have a date_of_birth field with an epoch string saved to it. I wanted to use angular material date picker to alter the date which is possible by converting it through //convert matDatepicker timestamp format to epoch and save var newDOB = new…
Monomoni
  • 415
  • 2
  • 4
  • 19
1
vote
0 answers

"How to use of angular Material DatePicker with Input tag going hide ?"

I am working with Angular Material and facing the problem to manage the DatePicker component because it's doing hide input box and because of that the selected date is not coming in the value of Input tag.
1
vote
2 answers

Implement variable binding in mat-datepicker

Description I'm trying to wrap the MatDatePicker in a custom component called MyDatePicker so that I can use it in the html as the following. Issue The dateVariable is always undefined and seems the two-way binding I implemented below is not…
A-Sharabiani
  • 17,750
  • 17
  • 113
  • 128
0
votes
0 answers

Angular Reactive Form - date in input field disappears after subsequent field is filled out

I am working on an Angular Reactive Form where our system sends an email to a customer. The controls and email template are set out in a JSON file that is in Contentstack (not relevant, just FYI). When the user wants to send an email, they select…
0
votes
1 answer

Color specific date in mat-date-range-input angular 10

I'm currently working on a project that involves using Angular Material's MatDatePicker (range Selection) component to display a calendar with custom styling for specific dates. I've encountered an issue while trying to apply custom CSS classes to…
0
votes
1 answer

how to change the label of the years button when it is disabled in mat-datapicker?

I am trying to change the label of the year selection button since when I disable dates the label text continues to take those dates into account, that is to say I have a minimum for the date selection from 2002 onwards when inserting this using the…
0
votes
1 answer

`mat-calendar` design not looking good when used in `mat-dialog`

In my angular 16 app i have used angular material. I want to display mat-calendar inside a modal popup dialog so i create a component and added mat-calendar inside it and load that component using mat-dialog but design of mat-calendar is not showing…
Ninja Turtle
  • 1,293
  • 2
  • 24
  • 50
0
votes
1 answer

Disable past dates except for single date in mat-datepicker Angular

I want disable past dates except 13-04-2023 in mat-datepicker. Currently i create datepicker with custom filter function to disable past dates except for 13-04-2023 but this dont working:( myFilter = (date: Date | null): boolean => { const…
kubare
  • 31
  • 3
0
votes
1 answer

invoke a call on select date in using mat-date-range-picker that uses mat-date-range-picker-actions

I want to use angular material date picker functionality to bind my dates with angular reactive forms. in normal case when i use the date picker functionality, the date immediately cause the formControl to change upon interaction. But when I use…
0
votes
0 answers

Angular mat-datepicker changing min/max date when I change FormGroup

I have a FormArray which contains multiple FormGroup, that have startDate and endDate, which can not overlap. I'm changing the FormGroup using a BehaviourSubject, in which I pass the current min and max date. When I submit, the previous form gets…
0
votes
1 answer

Angular Material datepicker mat-datepicker sets input value backwards by 1 day for non BST timezones

There was an issue with the mat-datepicker a year back where the user saved a date value and refreshes the page we moved backwards by 1 day We fetch the unix timestamp value ex: 1671235200000 from BE and display the value (display the UK…
adarsh
  • 1
  • 1
1 2 3
8 9