CODEWITHSUNDEEP
angularangular-material
Ranjith
Ranjith

Reputation: 327

Disabling mat-select in Angular

I have a dropdown. I want to disable the entire mat-select when the selected value is Uber. Otherwise, it needs to be enabled.

<mat-label>DB Property Name</mat-label>

<mat-select class="dBProperty"  name="dbpropertyName{{i}}" [(ngModel)]="mappingObj.dbpropertyName" [disabled]="selectedValue=='**Uber**'?'disabled':'null'" required>

<mat-option *ngFor="let options of dBPropertyArray" [value]="options.dBProperty" >{{options.dBProperty}}
                                                    </mat-option>

                                                </mat-select>

How can I achieve it ..? This is my code. where am I going wrong?

Upvotes: 8

Views: 40109

Answers (2)

Krishna Rathore
Krishna Rathore

Reputation: 9687

use disabled attribute for that.

<mat-select 
    class="dBProperty" 
    name="dbpropertyName{{i}}" 
    [(ngModel)]="mappingObj.dbpropertyName"
    [disabled]="mappingObj.dbpropertyName=='Uber'"
    required>

    <mat-option *ngFor="let options of dBPropertyArray" [value]="options.dBProperty">{{options.dBProperty}}
    </mat-option>

</mat-select>

Upvotes: 16

saravana kumar
saravana kumar

Reputation: 131

The below change will fix your issue. disabled property accepts boolean values. If true its disabled else enabled.

[disabled]="selectedValue=='Uber'"

Upvotes: 1

Related Questions