FloatingLabelComponent

Represents the Kendo UI FloatingLabel component for Angular. Use this component to provide floating labels to input elements.

The FloatingLabel supports Template and Reactive Forms. You can use it with Kendo UI for Angular Inputs components such as kendo-combobox, kendo-numerictextbox, or kendo-textbox. See example.

html

<kendo-floatinglabel text="First name">
  <kendo-textbox [(ngModel)]="name"></kendo-textbox>
</kendo-floatinglabel>

Selector

kendo-floatinglabel

Export Name

Accessible in templates as #kendoFloatingLabelInstance="kendoFloatingLabel"

Inputs

Name	Type	Default	Description
id	string		Sets the id attribute of the input inside the floating label.
labelCssClass	any		Sets the CSS classes for the label element. Accepts values supported by the ngClass directive.
labelCssStyle	any		Sets the CSS styles for the internal label element. Accepts values supported by the ngStyle directive.
optional	boolean	false	Marks a form field as optional. When enabled, renders the Optional text by default. You can customize the text by providing a custom message (see example).
text	string		Sets the text content of the floating label that describes the input.

Fields

Name	Type	Default	Description
labelPosition	FloatingLabelPosition		Gets the current floating label position.

Events

Name	Type	Description
positionChange	EventEmitter<FloatingLabelPosition>	Fires after the FloatingLabel position changes.