[disabled]="!isValid()" is not working in IE11 for Angular 8

Question

disabled attribute with function is not working in IE11. It remains disable all the time. Please refer below code:

HTML:

 <button type="submit" (click)="onSubmit()" [disabled]="!isValid()">SAVE</button>

Component (.ts)

isValid(){
    return this.providedId != null;
}

Just curious: have you tried with `[attr.disabled]` maybe? – user776686 Jun 02 '20 at 12:20 — user776686, Jun 02 '20 at 12:20
Yes, ```[attr.disabled]``` is not working – vaidehi_hirani Jun 02 '20 at 12:57 — vaidehi_hirani, Jun 02 '20 at 12:57

score 1 · Accepted Answer · answered Jun 02 '20 at 12:18

Try working with a getter, so you won't need the parentheses inside the template:

get isValid(){
    return this.providedId != null;  
    // Or any other complicated logic...
}

And the template without the parentheses:

<button [disabled]="!isValid">SAVE</button>

Manish · Answer 2 · 2020-06-02T12:10:28.373

0

Do you need that function isValid()? Are you having more logic in there?

Otherwise you can directly bind to providedId:

<button [disabled]="!providedId">
I am a button
</button>

edited Jun 02 '20 at 12:10

answered Jun 02 '20 at 11:11

Manish

2 Answers2