Komponen Slider Rentang Nilai
Kontrol geser interaktif untuk pemilihan angka, rentang nilai, step interval, dan binding reaktif.
Rikat Declarative / PrimeNG-StyleKomponen slider interaktif ala <p-slider> di PrimeNG untuk memilih nilai angka atau rentang dengan geseran halus (drag), mendukung batasan nilai, langkah bertahap (step), dan two-way binding data reaktif.
Slider Rentang Standar (0 - 100)
Nilai Default (35%)
Volume Audio (70%)
<!-- Slider Standar Nilai Awal 35% -->
<l-slider value="35"></l-slider>
<!-- Slider Volume 70% -->
<l-slider value="70"></l-slider>
Slider Bertahap (Step Intervals)
Langkah per 10 Unit (Step = 10)
Langkah per 25 Kuartal (Step = 25)
<!-- Slider dengan kenaikan per 10 angka -->
<l-slider value="40" step="10" min="0" max="100"></l-slider>
<!-- Slider kuartal kelipatan 25 -->
<l-slider value="75" step="25" min="0" max="100"></l-slider>
Rentang Kustom (Min & Maks)
Rentang Kapasitas Server (100 - 1.000 MB)
Status Nonaktif (Disabled)
<!-- Rentang khusus 100 s/d 1000 dengan step 50 -->
<l-slider value="500" min="100" max="1000" step="50"></l-slider>
<!-- Slider terkunci nonaktif -->
<l-slider value="60" disabled></l-slider>
Reaktif Two-Way Data Binding
Tingkat Kecerahan Layar
50%
0% (Redup)
50% (Normal)
100% (Maksimal)
<!-- Reaktif Two-Way Binding dengan State Rikat -->
<l-slider [(value)]="kecerahanLayar" min="0" max="100"></l-slider>
<!-- Terbaca langsung di elemen teks atau badge -->
<span class="c-badge c-badge-primary">{{ Error: Error pada Berkas '', baris 1: Variabel atau fungsi 'kecerahanLayar' tidak didefinisikan. }}%</span>