Mat autocomplete display value when we pass key

[mullamohiddin]

Bug, feature request, or proposal:

Mat autocomplte not able to set value if key avialable
Ex:
I have an auto complete with nationality list, my country contains country code and value. I want to set country code If I select country from drop down and If my response is having country code ,I need to map this with my Country name in ngModel. My problem is I am mapping country code to my ngModel and I need to show Country Name on UI screen.

What is the expected behavior?

When I get key from my response I need to show the value of that key.
note: mat-option [value]="country.code" working for Select Drop down, But same behaviour not working for Autocomplete drop down.

What is the current behavior?

If My response is sending key , ngModel displaying key instead of value

What are the steps to reproduce?

Providing a StackBlitz reproduction is the best way to share your issue.

StackBlitz starter: https://goo.gl/wwnhMV

https://stackblitz.com/edit/angular-pvqugs

[julianobrasil]

You need to use displayWith attribute. You can get more info and examples showing its usage in the official doc site: https://material.angular.io/components/autocomplete/overview#setting-separate-control-and-display-values

[crisbeto]

@julianobrasil is correct, the proper way to do this is through displayWith.

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}