CngxOptionGroup

DirectivePrimaryv0.1.0WCAG AA

projects/common/interactive/listbox/option-group.directive.ts

Import#

import { CngxOptionGroup } from '@cngx/common/interactive'

Description#

Groups related CngxOptions under a visual and semantic header.

Renders role="group" and aria-label - children stay flat in the AD item list; grouping is purely presentational and for ATs that render group labels.

Hierarchy-aware projection roots (e.g. CngxSelectShell) query CNGX_OPTION_CONTAINER to walk the direct children in DOM order and read each group's options to populate CngxSelectOptionGroupDef.options. Nested option groups are unsupported - a dev-warning fires when one is detected.

https://cngxjs.github.io/cngx/examples/#/common/interactive/option/flat-options-with-ad https://cngxjs.github.io/cngx/examples/#/common/interactive/option/grouped-options

Metadata#

Selector: [cngxOptionGroup]
Export as: cngxOptionGroup

Host#

Static attributes: rolegroup
[attr.aria-label]label()

Providers#

CNGX_OPTION_CONTAINER: useExisting CngxOptionGroup

Relationships

Depends on1

CNGX_OPTION_CONTAINERservice

Index#

Inputs#

label#string

input()Required

Accessible group label.

Instance Properties#

kind#unknown

Readonly

Discriminator for CNGX_OPTION_CONTAINER consumers.

'group' as const

HostBindings#

Binding	Expression
`[attr.aria-label]`	`label()`