feat(typeahead): add support for the "editable" option

Closes #788

Closes #789

src/typeahead/typeahead-config.ts

@@ -7,5 +7,6 @@ import {Injectable} from '@angular/core';
  */
 @Injectable()
 export class NgbTypeaheadConfig {
+  editable = true;
   showHint = false;
 }

src/typeahead/typeahead.spec.ts

@@ -394,6 +394,33 @@ describe('ngb-typeahead', () => {
            expect(getNativeInput(compiled).disabled).toBeTruthy();
          });
        }));
+
+    it('should only propagate model changes on select when the editable option is on', async(() => {
+         const html = `
+            <form>
+              <input type="text" [(ngModel)]="model" name="control" required [ngbTypeahead]="find" [editable]="false"/>
+            </form>`;
+         const fixture = createTestComponent(html);
+         fixture.whenStable().then(() => {
+           fixture.detectChanges();
+           const compiled = fixture.nativeElement;
+           expect(getNativeInput(compiled)).toHaveCssClass('ng-invalid');
+           expect(getNativeInput(compiled)).not.toHaveCssClass('ng-valid');
+
+           changeInput(compiled, 'o');
+           fixture.detectChanges();
+           expect(getNativeInput(compiled)).toHaveCssClass('ng-invalid');
+           expect(getNativeInput(compiled)).not.toHaveCssClass('ng-valid');
+           expect(fixture.componentInstance.model).toBeUndefined();
+
+           const event = createKeyDownEvent(Key.Enter);
+           getDebugInput(fixture.debugElement).triggerEventHandler('keydown', event);
+           fixture.detectChanges();
+           expect(getNativeInput(compiled)).not.toHaveCssClass('ng-invalid');
+           expect(getNativeInput(compiled)).toHaveCssClass('ng-valid');
+           expect(fixture.componentInstance.model).toBe('one');
+         });
+       }));
   });
 
   describe('select event', () => {

src/typeahead/typeahead.ts

@@ -79,6 +79,12 @@ export class NgbTypeahead implements ControlValueAccessor,
   private _windowRef: ComponentRef<NgbTypeaheadWindow>;
   private _zoneSubscription: any;
 
+
+  /**
+   * A flag indicating if model values should be restricted to the ones selected from the popup only.
+   */
+  @Input() editable: boolean;
+
   /**
    * A function to convert a given value into string to display in the input field
    */
@@ -117,6 +123,7 @@ export class NgbTypeahead implements ControlValueAccessor,
       private _elementRef: ElementRef, private _viewContainerRef: ViewContainerRef, private _renderer: Renderer,
       private _injector: Injector, componentFactoryResolver: ComponentFactoryResolver, config: NgbTypeaheadConfig,
       ngZone: NgZone) {
+    this.editable = config.editable;
     this.showHint = config.showHint;
 
     this._valueChanges = Observable.fromEvent(_elementRef.nativeElement, 'input', ($event) => $event.target.value);
@@ -136,7 +143,9 @@ export class NgbTypeahead implements ControlValueAccessor,
         this._valueChanges
             .do(value => {
               this._userInput = value;
-              this._onChange(value);
+              if (this.editable) {
+                this._onChange(value);
+              }
             })
             .let (this.ngbTypeahead));
   }