DevExtreme Angular - Configure Search Parameters
The Autocomplete can provide suggestions in two different modes: 'contains' (by default) and 'startswith'. You can use the searchMode option to change the mode.
- <dx-autocomplete
- [dataSource]="autocompleteData"
- valueExpr="country"
- searchMode="startswith">
- </dx-autocomplete>
- import { DxAutocompleteModule } from 'devextreme-angular';
- // ...
- export class AppComponent {
- autocompleteData = [
- { country: "Afghanistan", capital: "Kabul" },
- { country: "Albania", capital: "Tirana" },
- // ...
- ]
- }
- @NgModule({
- imports: [
- // ...
- DxAutocompleteModule
- ],
- // ...
- })
By default, the Autocomplete widget starts providing suggestions once an end user types the first character. To increase the number of characters that triggers suggestions, use the minSearchLength option.
- <dx-autocomplete ...
- [minSearchLength]="3">
- </dx-autocomplete>
- import { DxAutocompleteModule } from 'devextreme-angular';
- // ...
- export class AppComponent {
- // ...
- }
- @NgModule({
- imports: [
- // ...
- DxAutocompleteModule
- ],
- // ...
- })
You can also specify the time interval the widget should wait before providing suggestions. Assign this time interval measured in milliseconds to the searchTimeout option.
- <dx-autocomplete ...
- [searchTimeout]="500">
- </dx-autocomplete>
- import { DxAutocompleteModule } from 'devextreme-angular';
- // ...
- export class AppComponent {
- // ...
- }
- @NgModule({
- imports: [
- // ...
- DxAutocompleteModule
- ],
- // ...
- })
See Also
If you have technical questions, please create a support ticket in the DevExpress Support Center.