API do componente Combobox

Importação

import-combobox.ts

import { NuiCombobox, type NuiOption } from '@needless-ui/angular/select';

NuiCombobox

Um campo de texto que sugere opções enquanto você digita.

Seletor: nui-combobox

NuiCombobox: Propriedades
Nome	Tipo	Padrão	Descrição
`options`Input	`NuiOption<V>[]`		As opções, como objetos `NuiOption`.
`value`Bidirecional	`V \| null`	`null`	O valor escolhido, ou `null`. Também funciona com formulários.
`values`Bidirecional	`readonly V[]`	`[]`	Os valores escolhidos, com `multiple`.
`multiple`Input	`boolean`	`false`	Permite escolher várias opções, mostradas como chips.
`create`Input	`(text: string) => V`		Cria um valor a partir do texto digitado. A lista então oferece adicionar o texto que não é uma opção.
`filtering`Input	`boolean`	`true`	Filtra as opções enquanto você digita. Desative quando um servidor as filtrar.
`loading`Input	`boolean`	`false`	Mostra uma linha de carregamento enquanto os resultados estão a caminho.
`clearable`Input	`boolean`	`false`	Adiciona um botão que limpa o valor e permite limpá-lo com Esc.
`placeholder`Input	`string`	`''`	Texto mostrado enquanto o campo está vazio.
`label`Input	`string`		Nome acessível, quando nenhum `<label>` nomeia o campo.
`inputId`Input	`string`		Id do campo de texto, para `<label for>`.
`disabled`Input	`boolean`	`false`	Desativa o campo.
`compareWith`Input	`(a: V, b: V) => boolean`	`Object.is`	Diz se dois valores são a mesma opção, para valores que são objetos.
`displayWith`Input	`(value: V) => string`	`String`	Texto para um valor que não está entre as opções, como um definido antes de elas carregarem.
`virtual`Input	`boolean \| 'auto'`	`'auto'`	Renderiza só as linhas visíveis: sempre, nunca, ou `auto` acima de 200 linhas.
`queryChange`Output	`string`		Emite o texto enquanto ele é digitado, para uma busca no servidor.
`openChange`Output	`boolean`		Emite quando a lista abre ou fecha.
`show`Método	`() => void`		Abre a lista.
`hide`Método	`() => void`		Fecha a lista.
`clear`Método	`() => void`		Limpa o valor e o texto.
`focus`Método	`(options?: FocusOptions) => void`		Move o foco para o campo de texto.

Todo texto que ele mostra ou anuncia também é um input, então você pode traduzi-lo: emptyLabel loadingLabel clearLabel toggleLabel chipsLabel removeLabel createLabel

NuiOptionTemplate

Coloque-o em um ng-template dentro do componente para desenhar cada linha você mesmo. O contexto contém a opção e a linha dela.

Seletor: ng-template[nuiOptionTemplate]

NuiOptionText

Desenha o rótulo de uma opção com as letras encontradas destacadas, a descrição e o caminho dela, para as suas próprias linhas.

Seletor: [nuiOptionText]

NuiOptionText: Propriedades
Nome	Tipo	Padrão	Descrição
`nuiOptionText`Input	`NuiOptionRow<V>`		A linha, do contexto do template.