alfresco-ng2-components/docs/content-services/components/search-chip-autocomplete-input.component.md
Mykyta Maliarchuk 2a4507d529
[ACS-5266] Advanced Search - New component for Category facet (#8764)
* [ACS-5266] new component for category facet

* [ACS-5266] fixed tests & docs

* [ACS-5266] some fixes

* [ACS-5266] linting

* [ACS-5266] some improvements

* [ACS-5266] reduced observable from child component

* [ACS-5266] fixed docs

* [ACS-5266] rebase & improvements

* [ACS-5266] typo
2023-07-21 09:27:31 +02:00

4.0 KiB

Title, Added, Status, Last reviewed
Title Added Status Last reviewed
Search Chip Autocomplete Input component v6.1.0 Active 2023-06-13

Search Chip Autocomplete Input component

Represents an input with autocomplete options.

Search Chip Autocomplete Input

Basic usage

<adf-search-chip-autocomplete-input
    [autocompleteOptions]="autocompleteOptions"
    [onReset$]="onResetObservable$"
    [allowOnlyPredefinedValues]="allowOnlyPredefinedValues"
    (inputChanged)="onInputChange($event)"
    (optionsChanged)="onOptionsChange($event)">
</adf-search-chip-autocomplete-input>

Properties

Name Type Default value Description
autocompleteOptions AutocompleteOption[] [] Options for autocomplete
onReset$ Observable<void> Observable that will listen to any reset event causing component to clear the chips and input
allowOnlyPredefinedValues boolean true A flag that indicates whether it is possible to add a value not from the predefined ones
placeholder string 'SEARCH.FILTER.ACTIONS.ADD_OPTION' Placeholder which should be displayed in input.
compareOption (option1: AutocompleteOption, option2: AutocompleteOption) => boolean Function which is used to selected options with all options so it allows to detect which options are already selected.
formatChipValue (option: string) => string Function which is used to format custom typed options.
filter (options: AutocompleteOption[], value: string) => AutocompleteOption[] Function which is used to filter out possible options from hint. By default it checks if option includes typed value and is case insensitive.

Events

Name Type Description
inputChanged EventEmitter<string> Emitted when the input changes
optionsChanged EventEmitter<AutocompleteOption[]> Emitted when the selected options are changed

See also