diff --git a/src/lib/autocomplete/autocomplete-trigger.ts b/src/lib/autocomplete/autocomplete-trigger.ts index 1573b17a2bd7..ba175e64dd56 100644 --- a/src/lib/autocomplete/autocomplete-trigger.ts +++ b/src/lib/autocomplete/autocomplete-trigger.ts @@ -373,7 +373,9 @@ export class MdAutocompleteTrigger implements ControlValueAccessor, OnDestroy { private _setTriggerValue(value: any): void { const toDisplay = this.autocomplete.displayWith ? this.autocomplete.displayWith(value) : value; - this._element.nativeElement.value = toDisplay || ''; + // Simply falling back to an empty string if the display value is falsy does not work properly. + // The display value can also be the number zero and shouldn't fall back to an empty string. + this._element.nativeElement.value = toDisplay != null ? toDisplay : ''; } /** diff --git a/src/lib/autocomplete/autocomplete.spec.ts b/src/lib/autocomplete/autocomplete.spec.ts index 4f47b42fd7d1..1ec919562190 100644 --- a/src/lib/autocomplete/autocomplete.spec.ts +++ b/src/lib/autocomplete/autocomplete.spec.ts @@ -53,6 +53,7 @@ describe('MdAutocomplete', () => { AutocompleteWithoutForms, NgIfAutocomplete, AutocompleteWithNgModel, + AutocompleteWithNumbers, AutocompleteWithOnPushDelay, AutocompleteWithNativeInput, AutocompleteWithoutPanel @@ -1194,6 +1195,19 @@ describe('MdAutocomplete', () => { }); })); + it('should display the number when the selected option is the number zero', async(() => { + const fixture = TestBed.createComponent(AutocompleteWithNumbers); + + fixture.componentInstance.selectedNumber = 0; + fixture.detectChanges(); + + fixture.whenStable().then(() => { + const input = fixture.debugElement.query(By.css('input')).nativeElement; + + expect(input.value).toBe('0'); + }); + })); + it('should work when input is wrapped in ngIf', async(() => { const fixture = TestBed.createComponent(NgIfAutocomplete); fixture.detectChanges(); @@ -1462,6 +1476,23 @@ class AutocompleteWithNgModel { } +@Component({ + template: ` + + + + + + + {{ number }} + + + ` +}) +class AutocompleteWithNumbers { + selectedNumber: number; + numbers = [0, 1, 2]; +} @Component({ changeDetection: ChangeDetectionStrategy.OnPush,