• Getting Started
  • Components
    • Barcodes
    • Buttons
    • Chartsupdated
    • Conversational UIupdated
    • Data Query
    • Date Inputsupdated
    • Date Math
    • Dialogs
    • Drawing
    • Dropdownsupdated
    • Editor
    • Excel Export
    • File Saver
    • Filter
    • Gantt
    • Gauges
    • Gridupdated
    • Icons
    • Indicators
    • Inputsupdated
    • Labels
    • Layout
    • ListBox
    • ListView
    • Map
    • Menus
    • Navigation
    • Notification
    • Pager
    • PDF Export
    • PDFViewer
    • PivotGridupdated
    • Popup
    • ProgressBars
    • Ripple
    • Schedulerupdated
    • ScrollView
    • Sortable
    • Spreadsheetupdated
    • ToolBar
    • Tooltips
    • TreeList
    • TreeView
    • Typography
    • Uploads
    • Utilities
  • Styling & Themes
  • Common Features
  • Project Setup
  • Knowledge Base
  • Sample Applications
  • FAQ
  • Troubleshooting
  • Updates
  • Changelogs
New to Kendo UI for Angular? Start a free 30-day trial

LabelSettings

Represents the settings of the label which indicates the progress status of the ProgressBar.

@Component({
   selector: 'my-app',
   template: `
       <kendo-progressbar
             [value]="value"
             [label]="label">
       </kendo-progressbar>
   `
})
class AppComponent {
    public value = 50;
    public label = {
         visible: true,
         position: 'start',
         format: 'percent'
     };
}
NameTypeDefaultDescription

format?

LabelFn | LabelType

Sets the format that will be used when rendering the value in the label. The supported preset types are value (default) and percent. You can also provide a callback that will expose the current value and which has to return the formatted string that will be displayed in the label (see example).

position?

LabelPosition

Sets the position of the progress status label.

The accepted values are:

  • start
  • center
  • (Default) end

visible?

boolean

Determines whether the label for the progress status will be visible.

In this article

Not finding the help you need?