Source: https://primeng.org/bind

• Primary

  Surface

  PresetsAuraMaterialLaraNora

  Ripple

  RTL

• v20

  • v20

  • v19

  • v18

  • v17

Bind

The Bind directive dynamically applies DOM element attributes using properties defined in an object.

Import #

import { BindModule } from 'primeng/bind'

Examples #

The pBind is a directive that accepts an object of HTML attributes.

Static

Dynamic

<div [pBind]="{ 'aria-label': 'basic-box', class: 'bg-primary text-primary-contrast flex items-center justify-center p-4 rounded-lg w-32 font-medium' }"> Static </div>

<div [pBind]="boxBinding" pTooltip="Click to change color">
    Dynamic
</div>

• Import

• Examples

PrimeBlocks

490+ ready to use UI blocks crafted with PrimeNG and Tailwind CSS.

PrimeNG 20.3.0 by PrimeTek