Merge dfa3e98 into 8368efa

README.md

@@ -159,6 +159,7 @@ map: {
 | (close)  | Fired on select dropdown close |
 | (clear)  | Fired on clear icon click |
 | (focus)  | Fired on select focus |
+| (search) | Fired while typing search term |
 | (open)  | Fired on select dropdown open |
 | (remove)  | Fired when item is removed |
 | (scroll)  | Fired when scrolled. Provides the start and end index of the currently available items. Can be used for loading more items in chunks before the user has scrolled all the way to the bottom of the list. |

demo/app/examples/events.component.ts

@@ -1,4 +1,4 @@
-import { Component, ChangeDetectionStrategy } from '@angular/core';
+import { ChangeDetectionStrategy, Component } from '@angular/core';
 import { DataService } from '../shared/data.service';
 
 
@@ -21,6 +21,7 @@ interface AngSelectEvent {
                    (open)="onOpen()"
                    (close)="onClose()"
                    (focus)="onFocus($event)"
+                   (search)="onSearch($event)"
                    (blur)="onBlur($event)"
                    (clear)="onClear()"
                    (add)="onAdd($event)"
@@ -57,39 +58,43 @@ export class SelectEventsComponent {
     }
 
     onChange($event) {
-        this.events.push({name: '(change)', value: $event});
+        this.events.push({ name: '(change)', value: $event });
     }
 
     onFocus($event: Event) {
-        this.events.push({name: '(focus)', value: $event});
+        this.events.push({ name: '(focus)', value: $event });
     }
 
     onBlur($event: Event) {
-        this.events.push({name: '(blur)', value: $event});
+        this.events.push({ name: '(blur)', value: $event });
     }
 
     onOpen() {
-        this.events.push({name: '(open)', value: null});
+        this.events.push({ name: '(open)', value: null });
     }
 
     onClose() {
-        this.events.push({name: '(close)', value: null});
+        this.events.push({ name: '(close)', value: null });
     }
 
     onAdd($event) {
-        this.events.push({name: '(add)', value: $event});
+        this.events.push({ name: '(add)', value: $event });
     }
 
     onRemove($event) {
-        this.events.push({name: '(remove)', value: $event});
+        this.events.push({ name: '(remove)', value: $event });
     }
 
     onClear() {
-        this.events.push({name: '(clear)', value: null});
+        this.events.push({ name: '(clear)', value: null });
     }
 
     onScrollToEnd($event) {
-        this.events.push({name: '(scrollToEnd)', value: $event});
+        this.events.push({ name: '(scrollToEnd)', value: $event });
+    }
+
+    onSearch($event) {
+        this.events.push({ name: '(search)', value: $event })
     }
 }
 

src/ng-select/ng-select.component.spec.ts

@@ -2442,6 +2442,23 @@ describe('NgSelectComponent', function () {
             expect(fixture.componentInstance.onOpen).toHaveBeenCalledTimes(1);
         }));
 
+        it('should fire search event', fakeAsync(() => {
+            const fixture = createTestingModule(
+                NgSelectTestCmp,
+                `<ng-select [items]="cities"
+                            (search)="onSearch($event)"
+                            [(ngModel)]="selectedCity">
+                </ng-select>`);
+
+            spyOn(fixture.componentInstance, 'onSearch');
+
+            fixture.componentInstance.select.filter('term');
+            tickAndDetectChanges(fixture);
+
+            expect(fixture.componentInstance.onSearch).toHaveBeenCalledTimes(1);
+            expect(fixture.componentInstance.onSearch).toHaveBeenCalledWith('term');
+        }));
+
         it('should fire close event once', fakeAsync(() => {
             const fixture = createTestingModule(
                 NgSelectTestCmp,
@@ -3035,6 +3052,7 @@ class NgSelectTestCmp {
     onAdd() { }
     onRemove() { }
     onClear() { }
+    onSearch() { }
     onScroll() { }
     onScrollToEnd() { }
 }

src/ng-select/ng-select.component.ts

@@ -469,6 +469,8 @@ export class NgSelectComponent implements OnDestroy, OnChanges, AfterViewInit, C
                 this.itemsList.markSelectedOrDefault(this.markFirst);
             }
         }
+
+        this.searchEvent.emit(term);
     }
 
     onInputFocus($event) {