Overview
tng-slider is a range slider that implements ControlValueAccessor. It supports min, max, step, disabled, and slot-based styling for track, fill, thumb, and label.
Quick example
Basic
<form [formGroup]="form">
<tng-slider formControlName="volume" [min]="0" [max]="100" [step]="1" />
</form>
form = new FormGroup({
volume: new FormControl(50, { nonNullable: true }),
});
Features
min / max / step
Defaults: 0, 100, 1. Value is clamped to min/max.
Value: number
Form value is a number. Use with formControlName or controlled [value] / (valueChange).
Slot-based micro styling
slot: container, trackWrapper, track, trackFill, thumb, input, valueText.