Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

bug(mat-calendar): The dateClass callback is not called then in month view. #20017

Closed
N-Andronopoulos opened this issue Jul 16, 2020 · 5 comments · Fixed by #20256
Closed

bug(mat-calendar): The dateClass callback is not called then in month view. #20017

N-Andronopoulos opened this issue Jul 16, 2020 · 5 comments · Fixed by #20256
Assignees
Labels
area: material/datepicker P3 An issue that is relevant to core functions, but does not impede progress. Important, but not urgent

Comments

@N-Andronopoulos
Copy link

Reproduction

Steps to reproduce:

  1. Have a mat-calendar like:
              <mat-calendar
                [minDate]="today"
                [maxDate]="serviceMaxDate"
                [dateFilter]="filterDates"
                [dateClass]="classDates"
                [selected]="selectedDate"
                (selectedChange)="selectedDateChanges($event)">
              </mat-calendar>
  1. Select -> years (on top) -> select a year -> then dateFilter is called (for all year dates) but the dateClass is not. So I don't get css classes on months cells.

Expected Behavior

I should be able to put css classes on month cells just like the days cells.

Actual Behavior

Only while in date view the dateClass callback is called for all month days.

Environment

  • Angular: 9
  • CDK/Material: 9.2.4,
  • Browser(s): Chrome 83+
  • Operating System: Windows 10
@N-Andronopoulos N-Andronopoulos added the needs triage This issue needs to be triaged by the team label Jul 16, 2020
@jelbourn jelbourn added needs: clarification The issue does not contain enough information for the team to determine if it is a real bug and removed needs triage This issue needs to be triaged by the team labels Jul 16, 2020
@jelbourn
Copy link
Member

@N-Andronopoulos can you share a stackblitz that demonstrates this issue?

@crisbeto
Copy link
Member

I think that this is working as expected. The name implies that it'll be called only on date cells, rather than month or year cells from the other views.

@N-Andronopoulos
Copy link
Author

I think its logical to be used as I describe it since filterDates works in year view and there isn't an other way to put classes in year view. If it's implied that filterDates shouldn't work then and we should have a filterMonth/classMonth callbacks, but I think that's a waste of interface space. Year view (where you pick a month) should call classDates like it calls filterDates for all 365 days of the year.

@crisbeto
Copy link
Member

That's fair. I think that we might need to pass in the name of the current view to the callback too, otherwise there won't be a way to distinguish the first date of a month from the cell representing that month.

@crisbeto crisbeto added P3 An issue that is relevant to core functions, but does not impede progress. Important, but not urgent and removed needs: clarification The issue does not contain enough information for the team to determine if it is a real bug labels Jul 19, 2020
@crisbeto crisbeto self-assigned this Aug 10, 2020
crisbeto added a commit to crisbeto/material2 that referenced this issue Aug 10, 2020
We have a `dateClass` input that allows consumers to set classes to particular date cells, however currently we only invoke it inside the month view. These changes pass it along to the year and multi-year views too and provide the name of the view that invoked it so that cases like the first date of a month and a month cell can be distinguished.

Fixes angular#20017.
crisbeto added a commit to crisbeto/material2 that referenced this issue Aug 10, 2020
We have a `dateClass` input that allows consumers to set classes to particular date cells, however currently we only invoke it inside the month view. These changes pass it along to the year and multi-year views too and provide the name of the view that invoked it so that cases like the first date of a month and a month cell can be distinguished.

Fixes angular#20017.
crisbeto added a commit to crisbeto/material2 that referenced this issue Aug 12, 2020
We have a `dateClass` input that allows consumers to set classes to particular date cells, however currently we only invoke it inside the month view. These changes pass it along to the year and multi-year views too and provide the name of the view that invoked it so that cases like the first date of a month and a month cell can be distinguished.

Fixes angular#20017.
wagnermaciel pushed a commit that referenced this issue Aug 19, 2020
We have a `dateClass` input that allows consumers to set classes to particular date cells, however currently we only invoke it inside the month view. These changes pass it along to the year and multi-year views too and provide the name of the view that invoked it so that cases like the first date of a month and a month cell can be distinguished.

Fixes #20017.
@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Sep 19, 2020
wagnermaciel pushed a commit to wagnermaciel/components that referenced this issue Jan 14, 2021
…lar#20256)

We have a `dateClass` input that allows consumers to set classes to particular date cells, however currently we only invoke it inside the month view. These changes pass it along to the year and multi-year views too and provide the name of the view that invoked it so that cases like the first date of a month and a month cell can be distinguished.

Fixes angular#20017.
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
area: material/datepicker P3 An issue that is relevant to core functions, but does not impede progress. Important, but not urgent
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants