All Components

PopupComponent

Represents the Kendo UI Popup component for Angular.

Selector

kendo-popup

Inputs

anchor ElementRef

Specifies the element that will be used as an anchor. The Popup opens next to that element.

animate boolean

Controls the Popup animation. By default, the open and close animation are enabled.

offset OffsetPosition

Specifies the element absolute position. The Popup will open next to that point.

The Popup pivot point is defined by the popupAlign configuration option. The boundary detection is applied by using the Window view port.

The Offset type includes:

  • offset.left - Defines the left position of the Popup.
  • offset.top - Defines the top position of the Popup.

popupClass string

Specifies a list of CSS classes to be added to the internal animated element.

If the content of the Popup needs to be styled, use this property binding.

anchorAlign object

Specifies the anchor pivot point.

anchorAlign.horizontal - String(default: “left”)

Specifies the horizontal alignment point of the anchor.

The available options are:

  • left — Uses the leftmost point of the anchor element.
  • center — Uses the center point of the anchor element.
  • right — Uses the rightmost point of the anchor element.

anchorAlign.vertival - String(default: “bottom”)

Specifies the vertical alignment point of the anchor.

The available options are:

  • top — Uses the top point of the anchor element.
  • center — Uses the center point of the anchor element.
  • bottom — Uses the bottom point of the anchor element.

collision object

Configures the collision behavior of the Popup.

collision.horizontal - String(default: “fit”)

Defines the horizontal position of the Popup when it is not fully visible.

The available options are:

  • fit — Moves the Popup horizontally until it is fully displayed in the view port.
  • flip — Flips the Popup position based on the origin and position properties.

collision.vertical - String(default: “flip”)

Defines the vertical position of the Popup when it is not fully visible.

The available options are:

  • fit — Moves the Popup vertically until it is fully displayed in the view port.
  • flip — Flips the Popup position based on the origin and position properties.

popupAlign object

Specifies the popup pivot point.

popupAlign.horizontal - String(default: “left”)

Specifies the horizontal alignment point of the Popup.

The available options are:

  • left — Uses the leftmost point of the Popup element.
  • center — Uses the center point of the Popup element.
  • right — Uses the rightmost point of the Popup element.

popupAlign.vertival - String(default: “top”)

Specifies the vertical alignment point of the Popup.

The available options are:

  • top — Uses the top point of the Popup element.
  • center — Uses the center point of the Popup element.
  • bottom — Uses the bottom point of the Popup element.

Events

anchorViewportLeave EventEmitter

The anchorViewportLeave event is triggered when the anchor is scrolled outside the screen boundaries.

For more information, refer to the section on scrolling outside the viewport`.

In this article