'Selected Field Value visible in matToolTip but not in disabled divTable dropdown

I have the following code:

table.component.html

<div *ngFor="let person of persons; let i = index;" class="tbody">
    <div class="row">
        <div [matToolTip]="person.address ? person.address?.city : 'Address'" class="row-col">
            <select [(ngModel)]="person.address" [disabled]="!person.isHomeless" id="person_{{i}}" name="person_{{i}}">
                <option [ngValue]="null" disabled>
                    Select shelter
                </option>
                <option *ngFor="let shelter of shelters" (click) "person.address = shelter" [ngValue]="shelter">
                    {{ shelter.city }}
                </option>

table.component.ts

@Input() persons: Person[];
@Input() shelters: Shelter[];

Now when I select a shelter from the dropdown and save, the field gets disabled (as it should) but the value is not visible in the table. However the value is visible in the matToolTip.

I don't understand why that is and how to fix it



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source