angular-6-calendar-week-hours-view
Version:
This project supports on Angular 6.0+. and aims to provide an alternative view to those already provided on [Angular Calendar](https://github.com/mattlewis92/angular-calendar) v0.25.2. based out of [Angular Calendar Week Hours View](https://github.com/Inn
57 lines (45 loc) • 1.91 kB
Markdown
# Angular6CalendarWeekHoursView
This project supports on Angular 6.0+. and aims to provide an alternative view to those already provided on [Angular Calendar](https://github.com/mattlewis92/angular-calendar) v0.25.2.
based out of [Angular Calendar Week Hours View](https://github.com/Innqube/angular-calendar-week-hours-view) v1.0.2.
It probably won't receive much support from me (@jorgeconcep) or (@diegofsza) owner of the starting solution which provides support to
users of earlier versions of Angular (prior to 6), so you're encouraged to enhance it in any reasonable way and send pull requests.
## How it looks
## Getting Started
* Have Installed and working [Angular Calendar](https://github.com/mattlewis92/angular-calendar) v0.25.2 (or prior) in Angular 6.0+.
* Install the packages `npm install --save angular-6-calendar-week-hour-view rxjs-compat`.
* Implement the function hourSegmentClicked().
* Include the scss file in your `styles:[]` array in the angular.json file
```javascript
"../node_modules/angular-calendar-week-hours-view/angular-calendar-week-hours-view.scss" `
```
## Usage
Import the module wherever you want to use the view:
```javascript
@NgModule({
declarations: [
...
],
imports: [
...,
CalendarModule.forRoot(),
CalendarWeekHoursViewModule,
...
],
})
```
Use the view in your html
```html
<iq-calendar-week-hours-view
*ngSwitchCase="'week'"
[viewDate]="viewDate"
[events]="events"
[hourSegments]="2"
[dayStartHour]="8"
[dayEndHour]="20"
(eventClicked)="eventClicked($event)"
(hourSegmentClicked)="hourSegmentClicked($event)"
(eventTimesChanged)="eventTimesChanged($event)"
[refresh]="refresh">
</iq-calendar-week-hours-view>
```