Disable a button on condition

Ionic Framework ionic-v3
1

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-content>
 <ion-card *ngFor="let obj of responseObj;">
   <ion-list>
     <ion-item>
        User: {{obj.uid}}
     </ion-item>
     <ion-item>
        Status: {{obj.Status}}
     </ion-item>
     <ion-item>
        Approved/Rejected By: {{obj.ApprovedBy}}
     </ion-item>
     <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>
     </div>
    

   </ion-list>
 </ion-card>
</ion-content>

ts:

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;
      console.log(this.responseObj.itemStatus);
      
      for (var i = 0; i < this.responseObj.length; i++) {
        console.log(this.responseObj[i].Status);
      if(this.responseObj[i].Status == 'PENDING'){
        this.isenabled = true;
      }
      else{
        this.isenabled = false;
      }
    }
    });
  }
2

What happens now when you execute the code?

3

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

[disabled]=“obj.isEnabled”

4

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.

5

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