So far, we've covered the rendering of the slider background, as well as the rendering of the activity indicators. We've also generated ticks and displayed them with a grid line and a label, to display the calendar time of each tick.
Well, that does not really make a slider, does it? Of course, we also need to handle user input, and make the slider interactive, so that users can select a time range that they want to display the activities for.
To do this, add the following changes to the component class:
import { ChangeDetectionStrategy, Component, ElementRef, EventEmitter, HostListener, Input, OnChanges, Output, SimpleChanges, ViewEncapsulation} from '@angular/core';import {Activity, ActivitySliderSelection} from '../../model'; ...