Range-Feld

Das range-Feld speichert einen numerischen Wert, der für eine begrenzte, schiebereglerähnliche Eingabe innerhalb einer repeater-Zeile gedacht ist.

Am besten geeignet für

• Bewertungsdimensionen
• Vergleichsschieberegler
• gewichtete Einstellungen
• visuelle Fortschrittswerte

Schema Example

{ "name": "score", "label": "Score", "type": "range" }

Vorlagenverwendung

{{#each ratings as="item"}}
  <div class="rating-bar">
    <span>{{ item.label }}</span>
    <strong>{{ item.score }}</strong>
  </div>
{{/each}}

Fortschrittsbeispiel:

{{#each metrics as="item"}}
  <div class="metric-row">
    <span>{{ item.label }}</span>
    <progress value="{{ item.score }}" max="100"></progress>
  </div>
{{/each}}

Verwenden Sie es, wenn

Verwenden Sie range, wenn wiederholte Zeilen eine begrenzte numerische Eingabe benötigen statt einer frei eingegebenen Zahl.

Verwenden Sie es nicht, wenn

Verwenden Sie range nicht, wenn:

• die Zahl kein natürliches Min/Max-Verhalten hat
• der Wert Geld, eine Menge oder eine andere domänenspezifische Zahl ist

Verwenden Sie stattdessen number.

Technische Hinweise

• Verwenden Sie range, wenn die Zahl nur innerhalb einer begrenzten Skala sinnvoll ist
• Machen Sie die Interpretation der Skala in umgebenden Beschriftungen oder der UI deutlich
• Bevorzugen Sie number, wenn der Wert eine geschäftliche Menge statt einer bewertungsähnlichen Dimension ist
• Verwenden Sie es innerhalb strukturierter, wiederholter Zeilen, in denen jedes Element der gleichen Bewertungslogik folgt

Related

• Repeater
• Number
• Color