core/forms/range.component.ts
An component which renders a range slider in Cumulocity layout. You need to wrap the default range input in this component.
Example:
<c8y-range>
<input id="range" type="range" min="0" max="100000" value="0" step="1">
</c8y-range>
| selector | c8y-range |
| templateUrl | ./range.component.html |
Properties |
Methods |
| ngAfterContentInit |
ngAfterContentInit()
|
|
Returns :
void
|
| ngOnDestroy |
ngOnDestroy()
|
|
Returns :
void
|
| setValue |
setValue()
|
|
Returns :
void
|
| changeEventListener |
Type : EventListener
|
Default value : () => {...}
|
| left |
Type : string
|
| range |
Type : RangeDirective
|
Decorators :
@ContentChild(RangeDirective, {static: true})
|
| rangeValue |
Type : TemplateRef<any>
|
Decorators :
@ContentChild('c8yRangeValue', {static: true})
|
| value |
Type : string
|
<div class="range-wrap" style="--track-width: {{left}}">
<div class="range-value" [style.left]="left">
<span *ngIf="!rangeValue">{{ value }}</span>
<ng-container *ngTemplateOutlet="rangeValue"></ng-container>
</div>
<ng-content></ng-content>
</div>