18.0.1 • Published 9 months ago
wts-timepicker v18.0.1
Angular Timepicker v-17+
An Angular library that offers a visually intuitive and user-friendly time picker component using a clock face interface. This time picker is designed to enhance user experience by allowing them to easily select hours and minutes with a simple and interactive clock-style interface.
Install
npm install --save wts-timepicker
Getting started
import { Component} from '@angular/core';
import { WtsTimepickerComponent, TimepickerDirective, IOptions } from 'wts-timepicker';
@Component({
selector: '<COMPONENT-SELECTOR>',
standalone: true,
imports: [WtsTimepickerComponent, TimepickerDirective],
templateUrl: '<COMPONENT>.html',
styleUrl: '<COMPONENT>.scss',
})
export class MyComponent {
protected selectedTime = '02:45 pm';
options: IOptions = {
format: 12,
minutesGap: 5,
type: 'timepicker',
footerEnabled: false,
headerEnabled: true,
appearance: 'dialog',
positionY: 'auto',
positionX: 'left',
closeOnEscape: true,
autoClose: true
}
protected onChange(e: string): void {
this.selectedTime = e;
}
}
<div class="myclass">
<input type="text" [value]="selectedTime" [picker]="picker">
<wts-timepicker #picker [value]="selectedTime" [options]="options" (change)="onChange($event)"></wts-timepicker>
</div>
Example
18.0.1
9 months ago
18.0.0
11 months ago
3.0.9
2 years ago
3.0.4
2 years ago
3.0.3
2 years ago
3.0.2
2 years ago
3.0.1
2 years ago
3.0.8
2 years ago
3.0.7
2 years ago
3.0.6
2 years ago
3.0.5
2 years ago
3.0.0
2 years ago
2.2.0
2 years ago
2.1.9
2 years ago
2.1.8
2 years ago
2.1.7
2 years ago
2.1.6
2 years ago
2.1.5
2 years ago
2.1.4
2 years ago
2.1.3
2 years ago
2.1.2
2 years ago
2.1.1
2 years ago
2.1.0
2 years ago
2.0.8
2 years ago
2.0.7
2 years ago
2.0.6
2 years ago
2.0.5
2 years ago
2.0.4
2 years ago
2.0.3
2 years ago
2.0.2
2 years ago
2.0.1
2 years ago
2.0.0
2 years ago
1.0.5
2 years ago
1.0.4
2 years ago
1.0.3
2 years ago
1.0.2
2 years ago
1.0.1
2 years ago
1.0.0
2 years ago
0.0.1
2 years ago