I use mat-select To select a user's gender in angular 7 project and angular material
<mat-form-field>
<mat-select placeholder="Gender" required
formControlName="isMale"
[(ngModel)]="userProfile.isMale">
<mat-option value="false">Women</mat-option>
<mat-option value="true">Men</mat-option>
</mat-select>
<mat-hint align="end">Please Select...</mat-hint>
<mat-error *ngIf="isControlHasError('isMale','required')"><strong>Please Select Gender</strong>
</mat-error>
</mat-form-field>
userProfile get from server and isMale property is boolean type but after get data do not show selected value on mat-select I Also use this way but not work
<mat-option [value]="'false'">Women</mat-option>
<mat-option [value]="'true'">Men</mat-option>
but it doesn't work
This has worked for me (I am using Angular 8)
<mat-form-field>
<mat-select [(ngModel)]="userProfile.isMale">
<mat-option [value]="true">Men</mat-option>
<mat-option [value]="false">Women</mat-option>
</mat-select>
</mat-form-field>
Note that I used [value] = "true or false" without any single cotes. Obviously, userProfile.isMale should be boolean (true or false).
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With