Question

我有多个切换按钮。禁用时，我想将 class 添加到我的父div或红色，例如截至目前。

以下是我尝试过的演示：https://stackblitz.com/edit/ionic-j9amio?file=pages%2Fhome%2Fhome.ts

我的HTML

  <ion-content>
    <div *ngIf="searchResults?.details?.length > 0">
     <ion-item *ngFor="let searchResult of searchResults?.details">    
        <h2>{{searchResult?.user_id}}</h2>
        <h3>{{searchResult?.email}}</h3>
        <p>{{searchResult?.token}}</p> 
    <ion-label>on disable add red color {{searchResult?.user_id}}</ion-label>
    <ion-toggle checked="true" (ionChange)="jobIsDisabled($event,searchResult.user_id)">
    </ion-toggle>                                     
  </ion-item>             
</div>
</ion-content>

我的控制器

 searchResults = {
    "details": [{
        "user_id": "73",
        "email": "ejazanwar777@gmail.com",
        "token": "217808036f0215fee13aee8925574899"
    }, {
        "user_id": "74",
        "email": "hemanthraj2009@gmail.com",
        "token": "fe4fd5fa58075a69dd7e323cd0f1f2ad"
    }, {
        "user_id": "75",
        "email": "ggsgowtham17@gmail.com",
        "token": "9ed2839e54980a34e968e61d2bae362f"
    }, {
        "user_id": "76",
        "email": "contact@saddamhussain.com",
        "token": "e798b517a4171e1108e6809228c63c9c"
    }]
};


  jobIsDisabled(event,user_id){
     alert(user_id);
     console.log(event);
  }

Answer 1

//这是代码。它可能对你有帮助

我的HTML

dev_appserver.py

我的控制器

<ion-content>
    <div *ngIf="searchResults?.details?.length > 0" >
     <ion-item *ngFor="let searchResult of searchResults?.details; let i = index;" >    
        <h2>{{searchResult?.user_id}}</h2>
        <h3>{{searchResult?.email}}</h3>
        <p>{{searchResult?.token}}</p> 
    <ion-label class="{{searchResult.class}}">on disable add red color {{searchResult?.user_id}}</ion-label>
    <ion-toggle checked="true" (ionChange)="jobIsDisabled($event,searchResult.user_id, i)">
    </ion-toggle>                                     
  </ion-item>             
</div>
</ion-content>

禁用时如何为多个切换按钮添加课程

1 个答案: