Stack Overflow
Stack Overflow

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
16
votes
3 answers

How to select only year on mat-datepicker

I'm developing an application with angular 8 in which I have an input that contains only year number. I have used mat-datepicker and want only to choose year.
walidtlili
  • 840
  • 2
  • 13
  • 36
15
votes
4 answers

Angular Material DatePicker showing calendar below date field

I am trying to implement a basic date picker inside a dialog exactly as described in the documentation but it does not show the calendar icon correctly. Here is how it looks like: Here is the html template code for the dialog:
Chris
  • 1,417
  • 4
  • 21
  • 53
15
votes
4 answers

Multiple Date Select in Material datePicker (Angular)

I have a requirement that a user can select multiple dates in a date picker. How can I implement multiple date select functionality in an Angular Material date picker? I tried this through dateClass. But, after every date selection the date picker…
Vinoth A
  • 173
  • 1
  • 1
  • 8
11
votes
3 answers

Angular Material Datepicker input format

When selecting a date with the datepicker, everything works great, displaying the date in the desired format: DD/MM/YYYY But when entering manually a date with format DD/MM/YYYY, the datepicker automatically changes the date to MM/DD/YYYY, detecting…
Iñigo
  • 1,877
  • 7
  • 25
  • 55
5
votes
2 answers

Angular material Date validation not happening as expected

I am working on mat-datepicker where the User can enter the value and choose the date with my code It's working properly. I have an update button by default it will be in disabled mode. When the user met two conditions true then only the update…
Mr.M
  • 1,472
  • 3
  • 29
  • 76
5
votes
3 answers

How to add close button to customized mat-datepicker-header

I am using this UI component from the Angular material. https://material.angular.io/components/datepicker/overview#customizing-the-calendar-header I want to add close button the custom header but it seems not possible yet. At least I would like to…
Liu Zhang
  • 1,808
  • 19
  • 31
4
votes
2 answers

Angular - Input with ngx-mask MatDatepicker and reactive form

I would like to add a reactive form control over a form and an error is triggered: More than one custom value accessor matches form control with unspecified name attribute Everything works separately, reactive form validation, mask or…
Naw31
  • 43
  • 1
  • 1
  • 4
4
votes
1 answer

How to do two way binding mat date picker inside mat table

I am trying to show a few details of an employee on the mat table. The same table I made as editable. Except for datepicker every field is working .for date picker values are coming the same(last element in the array) since it is looping .please…
ebk
  • 305
  • 8
  • 20
4
votes
1 answer

Angular Mat Calendar Disable date based on Rest result

I am using Angular material calendar (i.e) mat-calendar. I am trying to disable some of the dates in the calendar based on dynamics value. HTML I am…
User42
  • 100
  • 2
  • 11
3
votes
1 answer

@angular-material-components/datetime-picker - '@angular/material/datepicker"' has no exported member 'DateRange'

I'm on angular material 9.2.0. I installed @angular-material-components/datetime-picker for dateTimePicker . I get this errors when I run ng build --prod.
Asakkour Soufiane
  • 518
  • 6
  • 19
3
votes
3 answers

Mat date start date end date validation angular 8

I am working on Mat date picker where I have start date and end date where I have one validation that is end date should not be lesser than start date for example if start date was 12-JAN-2020 end date can be 12-JAN-2020 or greater than this but it…
Mr.M
  • 1,472
  • 3
  • 29
  • 76
2
votes
0 answers

Dynamically set [max] value in Angular Mat Range picket

Max value in Mat ragepicker is not reflecting dynamically. I have replicated the same below. https://stackblitz.com/edit/angular-uc41kx-7a8m4h?file=src/app/date-range-picker-overview-example.html The below is what I have tried I wanted to limit the…
Ebison J
  • 47
  • 1
  • 7
2
votes
2 answers

Convert a mat-datepicker into a String

I'm trying to have a reactive form in which there is some dates that are entered by the user using mat-datepicker. The problem I face is that the output of the mat-datepicker is a moment object containing the date. I want to get the date in a String…
Théophile Wallez
  • 451
  • 3
  • 15
2
votes
1 answer

Can't remove the space where the Date-picker Label was supposed to be

I am trying to remove the extra space where the label was supposed to be (the green part) This seems to be the CSS for the date-picker, now here comes the problem : I added this in the .css file, but it doesn't seem to do…
user9802118
2
votes
2 answers

Angular Material Date Picker Range but only choosing year and month

I'm having troubles to find a way to use mat-date-range-picker with only year and month... Did you guys have already find a way to do it ? :) I've tried to use the same function used in the documentation for the date picker, but i cannot found a way…
Courbin .Francis
  • 23
  • 1
  • 5
1
2 3
…
8 9