mattlewis92 / angular-calendar

A flexible calendar component for angular 15.0+ that can display events on a month, week or day view.
https://mattlewis92.github.io/angular-calendar/
MIT License
2.72k stars 865 forks source link

Switching between custom views #1585

Closed RizkMak closed 2 years ago

RizkMak commented 2 years ago

@mattlewis92

Describe the bug

Hi, I wanted to add a 3 days view and be able to switch between this new view and the weekly view, could you please let me know how to do this. Below is the code I used

.html file

Previous
Today
Next
  </div>

{{ viewDate | calendarDate:(view + 'ViewTitle'):'en' }}

Week
3 days
    <div class="btn btn-primary" (click)="setView(CalendarView.Day)" [class.active]="view === CalendarView.Day">
        Day
    </div>
</div>

<div [ngSwitch]="view">

<mwl-calendar-week-view 
*ngSwitchCase="CalendarView.Week" 
[viewDate]="viewDate">
</mwl-calendar-week-view>

<mwl-calendar-week-view 
*ngSwitchCase="CalendarView.Week" 
[viewDate]="viewDate" 
[daysInWeek]="3">
</mwl-calendar-week-view>

<mwl-calendar-day-view *ngSwitchCase="CalendarView.Day" [viewDate]="viewDate">
</mwl-calendar-day-view>

Minimal reproduction of the problem with instructions

Screenshots

Screen Shot 2022-06-17 at 02 50 08

Versions

@angular/core: angular-calendar: 12.0+ Browser name and version: Chrome

matts-bot[bot] commented 2 years ago

This issue has been closed automatically as it did not follow the issue template, please open a new issue that follows the bug report or feature request template.

If you would like to submit a support issue or get a faster reply, please consider sponsoring me.

Thank you! ✌️