Getting Started
Overview
Installation
Theme
Forms
Basic Inputs
Select
Custom Inputs
Components
Navigation
Components
68
Micro Charts
Libraries
Kanban Board
Image Designer
Video Player
Visual Builder
Content Editor
Data View
Purchase

Popover

Popover shows lightweight contextual content in an overlay anchored to a trigger element. Use it for short details, previews, small interactive content, compact forms, or richer explanations that need more than a plain tooltip.

Popover can open on click or hover, use standard overlay positions, receive trigger context, and render lazy template content.

Do not use Popover for command lists, plain short hints, modal workflows, confirmations, side panels, or form dropdowns. Use Menu, Tooltip, Dialog, Confirm, Drawer, Select, Autocomplete, Datepicker, or ColorPicker instead.

Key features:
  • Click or hover triggers.
  • below, above, before, and after positioning.
  • Lazy content with trigger context.
  • Optional backdrop and custom close behavior.
  • TemplateRef support for fully custom floating surfaces.

The NgStarter Angular Popover component lets you show contextual overlay content anchored to a trigger. It supports click and hover triggers, lazy templates, custom positions, and Angular TemplateRef integration.

Basic Popover

Use a basic popover for short contextual content opened from a trigger.

Show popover by hover

Use hover only for preview-style content that can disappear without losing user input.

Popover custom position

Set position when the popover must open above, below, before, or after the trigger.

Popover lazy content

Use lazy content and context when one popover template renders data from the current trigger.

Popover with TemplateRef

Use a TemplateRef directly only when the standard popover panel wrapper should be replaced.