diff --git a/demo/src/app/components/+typeahead/demos/cancel-on-focus-lost/cancel-on-focus-lost.html b/demo/src/app/components/+typeahead/demos/cancel-on-focus-lost/cancel-on-focus-lost.html new file mode 100644 index 0000000000..15ece2e68e --- /dev/null +++ b/demo/src/app/components/+typeahead/demos/cancel-on-focus-lost/cancel-on-focus-lost.html @@ -0,0 +1,11 @@ +
Model: {{asyncSelected | json}}+ + +
Set config property cancelRequestOnFocusLost
to true
if you want to cancel async request on focus lost event
Use input property typeaheadHideResultsOnBlur
or config property hideResultsOnBlur
+
Use input property typeaheadHideResultsOnBlur
or config property hideResultsOnBlur
to prevent hiding typeahead's results until a user doesn't choose an item
used to hide results on blur
\n" }, + { + "name": "cancelRequestOnFocusLost", + "defaultValue": "false", + "type": "boolean", + "description": "if true, typeahead will cancel async request after focus was lost
\n" + }, { "name": "isAnimated", "defaultValue": "false", @@ -3920,7 +3926,7 @@ export const ngdoc: any = { "name": "typeaheadSingleWords", "defaultValue": "true", "type": "boolean", - "description": "Can be use to search words by inserting a single white space between each characters\nfor example 'C a l i f o r n i a' will match 'California'.
\n" + "description": "can be use to search words by inserting a single white space between each characters\nfor example 'C a l i f o r n i a' will match 'California'.
\n" }, { "name": "typeaheadWaitMs", @@ -3932,7 +3938,7 @@ export const ngdoc: any = { "defaultValue": " ", "type": "string", "description": "should be used only in case typeaheadSingleWords attribute is true.\nSets the word delimiter to break words. Defaults to space.
\n" - } + }, ], "outputs": [ { diff --git a/src/typeahead/typeahead.config.ts b/src/typeahead/typeahead.config.ts index 568f5cd33b..05e0a0ccbe 100644 --- a/src/typeahead/typeahead.config.ts +++ b/src/typeahead/typeahead.config.ts @@ -9,6 +9,8 @@ export class TypeaheadConfig { isAnimated = false; /** used to hide results on blur */ hideResultsOnBlur = true; + /** if true, typeahead will cancel async request on blur */ + cancelRequestOnFocusLost = false; /** used to choose the first item in typeahead container */ selectFirstItem = true; /** used to active/inactive the first item in typeahead container */ diff --git a/src/typeahead/typeahead.directive.ts b/src/typeahead/typeahead.directive.ts index 44a0c28584..1feaab2695 100644 --- a/src/typeahead/typeahead.directive.ts +++ b/src/typeahead/typeahead.directive.ts @@ -137,6 +137,8 @@ export class TypeaheadDirective implements OnInit, OnDestroy { _container: TypeaheadContainerComponent; isActiveItemChanged = false; isTypeaheadOptionsListActive = false; + isFocused = false; + cancelRequestOnFocusLost = false; // tslint:disable-next-line:no-any protected keyUpEventEmitter: EventEmitter