Disable a button on condition

Hi all I’m stuck in a situation and need help.
What I’m trying to do is I want to disable the button if the application status is approved or rejected and enable if the status is pending, but unable to do so…
Ant help is appreciated.

 <ion-card *ngFor="let obj of responseObj;">
        User: {{obj.uid}}
        Status: {{obj.Status}}
        Approved/Rejected By: {{obj.ApprovedBy}}
     <div style="text-align: center">
        <button ion-button [disabled]="!isenabled" (click)="appRej(obj.id, obj.uid, obj.type, obj.SataDate, obj.EndDate, obj.reason, obj.Status)">Approve/Reject</button>



ionViewDidLoad() {
    this.http.get("http://api.leave_dtls.php").subscribe(data => {
      console.log("Got Leave List");
      this.data = data.json();
      var response = JSON.parse(data["_body"]);
      this.responseObj = response.response_data;
      for (var i = 0; i < this.responseObj.length; i++) {
      if(this.responseObj[i].Status == 'PENDING'){
        this.isenabled = true;
        this.isenabled = false;

What happens now when you execute the code?

what i see (atleast i think) is that you are looping over several objects en then setting a global variable accordingly. so each loop it overwrites the value, if the last item is false. then the disabled flag will also be false.

maybe you can try

[disabled]="obj.Status !== ‘PENDING’ "

or when you loop over the items you could add a ‘isEnabled’ property to the item and then do


when I execute the code the if the status is found to be pending in the for loop every button gets disabled as per the condition.

Thanks for your reply I used a rather easy way to deal with it by using *ngIf.