Usage

Assemble the radio directives in your template.

<div ngpRadioGroup [(ngpRadioGroupValue)]="value">
  <button ngpRadioItem ngpRadioItem="Option 1">
    <ng-icon ngpRadioIndicator name="dot" />
    Option 1
  </button>

  <button ngpRadioItem ngpRadioItem="Option 2">
    <ng-icon ngpRadioIndicator name="dot" />
    Option 2
  </button>

  <button ngpRadioItem ngpRadioItem="Option 3">
    <ng-icon ngpRadioIndicator name="dot" />
    Option 3
  </button>
</div>

API Reference

The following directives are available to import from the @ng-primitives/ng-primitives/radio package:

NgpRadioGroupDirective

ngpRadioGroupValue
string | undefined

Define the selected value.

ngpRadioGroupDisabled
boolean
default: "false"

Define the disabled state.

ngpRadioGroupOrientation
'vertical' | 'horizontal'
default: "horizontal"

Define the orientation.

ngpRadioGroupValueChange
boolean

Event emitted when the selection changes.

NgpRadioItemDirective

ngpRadioItemValue
string
required

Define the value of this item.

ngpRadioItemDisabled
boolean
default: "false"

Define the disabled state.

NgpRadioIndicatorDirective

There are no inputs or outputs for this directive.

Schematics

You can use our schematic to generate a new checkbox component.

Options

name
string

The name of the component.

project
string

The name of the project to add the component to.

path
string

The path to create the component.