Тултип
PrimeNG/Tooltip (opens in a new tab)
Директива всплывающей подсказки предоставляет консультативную информацию для компонента.
С чего начать
Подключите модуль
import { TooltipModule } from 'primeng/tooltip';Встройте компонент с помощью директивы pTooltip.
Positions
Focus and Blur
Button
Sizes
Свойства
| Name | Type | Default | Description |
|---|---|---|---|
| pTooltip | string | null | Text of the tooltip. |
| tooltipPosition | string | right | Position of the tooltip, valid values are right, left, top and bottom. |
| tooltipEvent | string | hover | Event to show the tooltip, valid values are hover and focus. |
| positionStyle | string | absolute | Type of CSS position. |
| tooltipDisabled | boolean | false | When present, it specifies that the component should be disabled. |
| appendTo | string | any | Target element to attach the overlay, valid values are "body", "target" or a local ng-template variable of another element (note: use binding with brackets for template variables, e.g. [appendTo]="mydiv" for a div element having #mydiv as variable name). |
| hideDelay | number | null | Delay to hide the tooltip in milliseconds. |
| showDelay | number | null | Delay to show the tooltip in milliseconds. |
| life | number | null | Time to wait in milliseconds to hide the tooltip even it is active. |
| tooltipStyleClass | string | null | Style class of the tooltip. |
| escape | boolean | true | By default the tooltip contents are rendered as text. Set to false to support html tags in the content. |
| tooltipZIndex | string | auto | Whether the z-index should be managed automatically to always go on top or have a fixed value. |
Стилизация
| Name | Element |
|---|---|
| p-tooltip | Container element. |
| p-tooltip-arrow | Arrow of the tooltip. |
| p-tooltip-text | Text of the tooltip. |