Skip to main content
NeuralUIv1.14.3New
GitHub
Component

Listbox

Persistent single or multiple selection list with keyboard support, search and item templates.

TypeScript
import { NeuListboxComponent, NeuListboxItemDirective, NeuListboxHeaderDirective, NeuListboxFooterDirective, NeuListboxEmptyDirective } from '@neural-ui/core/listbox';
Roles
Workspace rolesChoose one or more roles

Choose one or more roles.

TypeScript
import { NeuListboxComponent, NeuListboxItemDirective, NeuListboxHeaderDirective, NeuListboxFooterDirective, NeuListboxEmptyDirective } from '@neural-ui/core/listbox';

@Component({
  imports: [NeuListboxComponent, NeuListboxItemDirective, NeuListboxHeaderDirective, NeuListboxFooterDirective, NeuListboxEmptyDirective],
  template: `
    <neu-listbox label="Roles" [options]="options" [multiple]="true">
      <ng-template neuListboxHeader><strong>Workspace roles</strong></ng-template>
      <ng-template neuListboxItem let-role>● {{ role.label }}</ng-template>
      <ng-template neuListboxEmpty>No matching role</ng-template>
      <ng-template neuListboxFooter><small>Choose one or more roles</small></ng-template>
    </neu-listbox>`
})
export class ExampleComponent {}