New to Kendo UI for AngularStart a free 30-day trial

PopoverComponent

Represents the Kendo UI Popover component for Angular. Displays additional information related to a target element.

html
<kendo-popover>
  <ng-template kendoPopoverTitleTemplate>Title</ng-template>
  <ng-template kendoPopoverBodyTemplate>Body</ng-template>
  <ng-template kendoPopoverActionsTemplate>Actions</ng-template>
</kendo-popover>

Selector

kendo-popover

Inputs

NameTypeDefaultDescription

animation

PopoverAnimation

false

Enables and configures the Popover animation. See example.

Accepts a boolean to enable the default animation, or a PopoverAnimation object for custom settings.

body

string

Represents the text rendered in the Popover body section. If a bodyTemplate is provided, it takes precedence.

callout

boolean

true

Determines whether a callout is rendered along the Popover. See example.

height

string | number

'auto'

Determines the height of the Popover. Numeric values are treated as pixels.

offset

number

6

Specifies the distance from the Popover to its anchor element in pixels.

position

Position

'right'

Specifies the position of the Popover relative to its anchor element. See example.

templateData

PopoverDataFn

Defines a callback function that returns custom data for the Popover templates. The function exposes the anchor element as an argument and returns an object that can be used in the templates. See example.

title

string

Specifies the main header text of the Popover. If a titleTemplate is provided, it takes precedence.

width

string | number

'auto'

Determines the width of the Popover. Numeric values are treated as pixels.

Events

NameTypeDescription

hidden

EventEmitter<any>

Fires after the Popover has been hidden and the animation has ended. See example.

hide

EventEmitter<PopoverHideEvent>

Fires when the Popover is about to be hidden. The event is preventable. If canceled, the Popover remains visible. See example.

show

EventEmitter<PopoverShowEvent>

Fires before the Popover is shown. The event is preventable. If canceled, the Popover will not display. See example.

shown

EventEmitter<PopoverShownEvent>

Fires after the Popover has been shown and the animation has ended. See example.

In this article
SelectorInputsEvents
Not finding the help you need?
Contact Support