Muidem
Muidem

Reputation: 47

Dynamically disable option of html-select in Angular 4

is there a way to disable an option of a select element in angular 4?

I tried something like this but it does not work

<select type="number" [(ngModel)]="selectedItem">
    <option [disabled]="i.disabled" *ngFor="let i of items" [ngValue]="i.id">{{i.designator}}</option>
</select>

Whereabout i.disabled contains a boolean.

Many thanks in advance

Upvotes: 1

Views: 13147

Answers (2)

Suraj Khanal
Suraj Khanal

Reputation: 540

this.items = [{id:1,disabled:true,designator:123}];

<select type="number" [(ngModel)]="selectedItem">
              <option [disabled]="i.disabled" *ngFor="let i of items" [ngValue]="i.id">{{i.designator}}</option>
          </select>

working fine.

Upvotes: 1

Sajeetharan
Sajeetharan

Reputation: 222522

It works fine here

<select type="number" [(ngModel)]="selectedItem">
    <option [disabled]="i.disabled" *ngFor="let i of items" [ngValue]="i.name">{{i.name}}</option>
</select>

DEMO

Upvotes: 6

Related Questions