Skip to main content

Input Decorators

API Usage

Input decorators

InputTypeRequiredDescription
dropdownDatastring[] or object[]Yes.Accepts array of strings or numbers or array of objects
objectPropertystringYesRequired only if dropdownData is object[]. Helps to display dropdown value in dropdown list.
placeholderstringNoCustom placeholder for autocomplete input field.
defaultValuestring or objectNoTo pre-select a value from dropdown.
initialVisibleDatanumberNoDisplays 1000 records in dropdown by default. Can be changed as per project requirement.
scrollThresholdnumberNo3 by default. Helps to boost performance. It controls the scroll data and removes top or botton records during user scroll based on the scrollThreshold & initialVisibleData configured. Check below for more details.
totalRecordsnumberNoIf total number of records is known, totalRecords can be provided which will avoid extra events getting executed.
disablePropertystringNoTo disable specific dropdown list item in dropdown. User cannot select the dropdown if disabled. This property can be used for object[] dropdown and disableProperty should be one of the boolean property in object
disableListFnFunctionNoIf disabling a list item should be calculated dynamically using a function and custom code, assign customized function to disableListFn. disableListFn accepts two parameters (index, data)
searchFnFunctionNoCustomized search function. Customized search function accepts one parameter, event. On keyUp, the customized search function will be called to perform custom execution.
isNumberbooleanNoIf the displayed list is number, then sending isNumber as true will help to search the list efficiently
noSearchResultMessagestringNoBy default No results found message will be displayed when search result is 0. It can be changed with this input property.
customTrackByFunctionNoCustom ngFor trackBy Function
isAutoCompleteDisabledbooleanNoDefault is false. When set to true, the input field gets disabled.
isCustomSpinnerbooleanNoDefault is false. When set to true, custom spinner can be implemented with custom class.
customClassobjectNoAllows custom class styling at various dom levels. Check below for more information
customStyleobjectNoAllows custom ng-style. Check below for more information
showdropDownArrowbooleanNoDefault is true. Show or hide dropdown icon in autocomplete field.
showClearOptionbooleanNoDefault is true. Shows clear option to allow the user to reset or clear the selected value.
showLoadingSpinnerbooleanNoDefault is true. Shows the spinner at the botton of the list during lazy loading API call. If set to false, spinner will not be shown.
triggerBlurEventbooleanNoDefault is false. When set to true, it emits an output event emitBlurEvent during focusOut
triggerApiLoadEventbooleanNoDefault is false. If dropdown list is loaded through API via lazy loading, this can be set as true, it emits an event emitApiLoadEvent. When the output event is emitted, user can take care of loading the dropdown data further.
triggerAutoCompleteOpenEventbooleanNoDefault is false. When set to true, it emits an output event emitAutoCompleteOpenEvent when auto-complete dropdown list opens.
triggerSearchEventbooleanNoDefault is false. When set to true, emits an output event emitSearchEvent whenever user types and search.
triggerClearSelectionEventbooleanNoDefault is false. When set to true, emits an output event emitClearSelectedEvent whenever selected field is cleared.
isScrollThresholdRequiredbooleanNoDefault is true. If initialVisibleData and scrollThreshold is performance calculation is not required, set it to false. See below for more information.
inspectAutoCompleteListbooleanNoDefault is false. When set to true, autocomplete dropdown will not be closed or hidden during onBlur or onFocusOut events. This is intended only for debugging and development purposes. For production it should be always false to avoid interruption.
showViewMorebooleanNoDefault is true. View More List will be shown at the end of dropdown if user has enabled lazy loading (triggerApiLoadEvent). View More will appear only when API call is to be executed.
optViewMoreOnlyForApiCallbooleanNoDefault is false. When set to true, API Call will not be executed on reaching the end of the scroll, instead View More button has to be clicked to call the API or any custom function.
viewMoreTextstringNoDefault text is View More. It can be customized with this input property.