API del componente Select

Importación

import-select.ts

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

Un botón que abre una lista de opciones.

NuiSelect: Propiedades
Nombre	Tipo	Predeterminado	Descripción
`options`Input	`NuiOption<V>[]`		Las opciones, como objetos `NuiOption`.
`value`Bidireccional	`V \| null`	`null`	El valor elegido, o `null`. También funciona con formularios.
`values`Bidireccional	`readonly V[]`	`[]`	Los valores elegidos, con `multiple`.
`multiple`Input	`boolean`	`false`	Permite elegir varias opciones. La lista sigue abierta mientras eliges.
`selectAll`Input	`boolean`	`false`	Con `multiple`, añade un botón que marca o desmarca todas las opciones.
`placeholder`Input	`string`	`'Select…'`	Texto que se muestra mientras no hay nada elegido.
`label`Input	`string`		Nombre accesible, cuando ningún `<label>` da nombre al botón.
`triggerId`Input	`string`		Id del botón, para `<label for>`.
`disabled`Input	`boolean`	`false`	Desactiva el select.
`compareWith`Input	`(a: V, b: V) => boolean`	`Object.is`	Indica si dos valores son la misma opción, para valores que son objetos.
`virtual`Input	`boolean \| 'auto'`	`'auto'`	Renderiza solo las filas visibles: siempre, nunca, o `auto` con más de 200 filas.
`openChange`Output	`boolean`		Emite cuando la lista se abre o se cierra.
`show`Método	`() => void`		Abre la lista.
`hide`Método	`() => void`		Cierra la lista.
`focus`Método	`(options?: FocusOptions) => void`		Pone el foco en el botón.

Todos los textos que muestra o anuncia también son inputs, así que puedes traducirlos: selectAllLabel clearAllLabel emptyLabel

Una opción. La aceptan el select, el combobox y la paleta de comandos.

NuiOption: Propiedades
Nombre	Tipo	Descripción
`value`Propiedad	`V`	Lo que se asigna al elegirla. De cualquier tipo.
`label`Propiedad	`string`	El texto que se muestra y se busca.
`description`Propiedad	`string`	Texto secundario bajo la etiqueta.
`group`Propiedad	`string`	Las opciones del mismo grupo se listan bajo ese encabezado, en orden.
`keywords`Propiedad	`string[]`	Más palabras con las que coincide la búsqueda, como sinónimos o códigos.
`disabled`Propiedad	`boolean`	Se muestra, pero no se puede elegir.
`children`Propiedad	`NuiOption<V>[]`	Opciones un nivel más abajo, que convierten la lista en un árbol.

Ponlo en un ng-template dentro del componente para dibujar tú cada fila. El contexto contiene la opción y su fila.

Dibuja la etiqueta de una opción con las letras coincidentes resaltadas, su descripción y su ruta, para tus propias filas.

NuiOptionText: Propiedades
Nombre	Tipo	Predeterminado	Descripción
`nuiOptionText`Input	`NuiOptionRow<V>`		La fila, del contexto de la plantilla.