diff --git a/src/lib/autocomplete/autocomplete-trigger.ts b/src/lib/autocomplete/autocomplete-trigger.ts index 33d5510dcc61..6d59a10d7bbf 100644 --- a/src/lib/autocomplete/autocomplete-trigger.ts +++ b/src/lib/autocomplete/autocomplete-trigger.ts @@ -387,7 +387,9 @@ export class MatAutocompleteTrigger implements ControlValueAccessor, OnDestroy { } private _setTriggerValue(value: any): void { - const toDisplay = this.autocomplete.displayWith ? this.autocomplete.displayWith(value) : value; + const toDisplay = this.autocomplete && this.autocomplete.displayWith ? + this.autocomplete.displayWith(value) : + value; // 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. diff --git a/src/lib/autocomplete/autocomplete.spec.ts b/src/lib/autocomplete/autocomplete.spec.ts index eb3e117a2d15..302e5ec93621 100644 --- a/src/lib/autocomplete/autocomplete.spec.ts +++ b/src/lib/autocomplete/autocomplete.spec.ts @@ -1467,6 +1467,15 @@ describe('MatAutocomplete', () => { }).toThrow(getMatAutocompleteMissingPanelError()); })); + it('should not throw on init, even if the panel is not defined', fakeAsync(() => { + expect(() => { + const fixture = TestBed.createComponent(AutocompleteWithoutPanel); + fixture.componentInstance.control.setValue('Something'); + fixture.detectChanges(); + tick(); + }).not.toThrow(); + })); + it('should hide the placeholder with a preselected form control value ' + 'and a disabled floating placeholder', fakeAsync(() => { const fixture = TestBed.createComponent(AutocompleteWithFormsAndNonfloatingPlaceholder); @@ -1821,10 +1830,11 @@ class AutocompleteWithNativeInput { @Component({ - template: `` + template: `` }) class AutocompleteWithoutPanel { @ViewChild(MatAutocompleteTrigger) trigger: MatAutocompleteTrigger; + control = new FormControl(); }