Alejandro
Alejandro

Reputation: 165

showing month and year in a mat-picker

I would like to display a calendar with month and year using angular-material looking through the documentation i saw this but i need the name of the month

https://stackblitz.com/angular/ggalrrqvxdg?file=app%2Fdatepicker-views-selection-example.ts

i used this code and it shows the name of the month but still show me the day how could i hide that day?

export const MY_FORMATS = {
  parse: {
    dateInput: 'LL',
  },
  display: {
    dateInput: 'LL',
    monthYearLabel: 'MMM YYYY',
    dateA11yLabel: 'LL',
    monthYearA11yLabel: 'MMMM YYYY',
  },
};

Upvotes: 0

Views: 405

Answers (1)

JossFD
JossFD

Reputation: 2216

If you just want to change the displayed value in the input use this:

export const MY_FORMATS = {
  parse: {
    dateInput: 'MM/YYYY',
  },
  display: {
    dateInput: 'MMM/YYYY',
    monthYearLabel: 'MMM YYYY',
    dateA11yLabel: 'LL',
    monthYearA11yLabel: 'MMMM YYYY',
  },
};

The display: { dateInput: 'MMM/YYYY', ... needed an extra M to show the name instead of the value.

If you want to full month name (e.g: June instead of Jun), you can have MMMM/YYYY.

Upvotes: 1

Related Questions