app.component.ts
import { Component } from '@angular/core';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
time = {hour: 4, minute: 19, second:1};
}
app.component.html
<h4 style="padding-top:25px; padding-bottom:25px;">
Angular Bootstrap - Timepicker custom steps
</h4>
<h5><b>Selected Time:</b></h5>
<br/>
<h5>{{time | json}}</h5>
<br/>
<ngb-timepicker [(ngModel)]="time"
[hourStep]="2" [minuteStep]="5"
[secondStep]="10" [seconds]="true">
</ngb-timepicker>
- angular bootstrap - Popover with HTML content
- angular bootstrap - How to delay Popover open close
- angular bootstrap - How to use Timepicker
- angular bootstrap - Timepicker with second
- angular bootstrap - Timepicker with meridian
- angular bootstrap - Timepicker without spinner
- angular bootstrap - Datepicker navigate to current month
- angular bootstrap - Datepicker navigate to specific year month
- angular bootstrap - Datepicker navigate select specific date
- angular bootstrap - Datepicker default selected date
- angular bootstrap - Datepicker default visible year month
- angular bootstrap - How to show Datepicker in a popup
- angular bootstrap - Select date range from Datepicker popup
- angular bootstrap - How to enable disable Datepicker
- angular bootstrap - Datepicker custom day style