[Ionic 3] Liste contenant un checkbox et un bouton
Bonjour,
Voici le code html de ma page :
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
| <ion-header>
<ion-navbar>
<ion-title>Liste des demandes</ion-title>
<ion-buttons end>
<button ion-button icon-only (click)="closeModal()">
<ion-icon item-right name="ios-close-outline"></ion-icon>
</button>
</ion-buttons>
</ion-navbar>
</ion-header>
<ion-content padding>
<ion-list>
<table width="100%">
<tr *ngFor="let MaDemande of DemandesATraiter" >
<td>
<ion-checkbox checked="{{MaDemande.checked}}" (ionChange)="updateDemande(MaDemande)"></ion-checkbox>
</td>
<td>
<button ion-item (click)="select_item($event, MaDemande)">
Collaborateur : {{MaDemande.collaborateur}}<br/>
Support : {{MaDemande.support}} <br/>
Contrat : {{MaDemande.numContrat}} <br/>
Date de début : {{MaDemande.DateDebut}} <br/>
Date de fin : {{MaDemande.DateFin}}<br/>
Statut : {{MaDemande.statutString}}<br/>
Refus : {{MaDemande.refuse}}
</button>
</td>
</tr>
</table>
</ion-list>
<button type="submit" ion-button full (click)="traiterDemandes();">Traiter les demandes</button>
</ion-content> |
Le code de la page ts :
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
| import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams, ModalController } from 'ionic-angular';
import {DetailDemandePage} from '../detail-demande/detail-demande';
//import {AppService} from '../../app/app-service';
@IonicPage()
@Component({
selector: 'page-liste-demandes',
templateUrl: 'liste-demandes.html',
//providers: [AppService]
})
export class ListeDemandesPage {
public DemandesATraiter:any;
public ListeRefus:any;
constructor(public navCtrl: NavController, public navParams: NavParams, /*private AppService:AppService, */private modalCtrl:ModalController) {
this.DemandesATraiter=this.navParams.get("Demandes");
this.ListeRefus=this.navParams.get("Refus");
//alert(JSON.stringify(this.ListeRefus));
}
closeModal(){
this.navCtrl.pop();
}
select_item(event, var_item){
let indRefus:number;
let profileModal = this.modalCtrl.create(DetailDemandePage, {
infoDemande: var_item,
Refus:this.ListeRefus
});+
profileModal.onDidDismiss(data=>{
if(data)
{
if(data.Accepte=="0")
{
indRefus=Number(data.indRefus);
this.DemandesATraiter[var_item.indice].statut="0";
this.DemandesATraiter[var_item.indice].statutString=var_item.messRefuse;
this.DemandesATraiter[var_item.indice].refuse=this.ListeRefus[indRefus].libelle;
this.DemandesATraiter[var_item.indice].oidrefuse=this.ListeRefus[indRefus].oid;
this.DemandesATraiter[var_item.indice].indiceRefus=data.indRefus;
}
else
{
this.DemandesATraiter[var_item.indice].statut="1";
this.DemandesATraiter[var_item.indice].statutString=var_item.messAccepte;
this.DemandesATraiter[var_item.indice].refuse="";
this.DemandesATraiter[var_item.indice].oidrefuse="";
this.DemandesATraiter[var_item.indice].indiceRefus="0";
}
this.DemandesATraiter[var_item.indice].checked=true;
}
});
profileModal.present();
} //select_item
updateDemande(param_item:any){
if(param_item){
if(!param_item.checked){
this.DemandesATraiter[param_item.indice].statut="1";
this.DemandesATraiter[param_item.indice].statutString=param_item.messAccepte;
this.DemandesATraiter[param_item.indice].refuse="";
this.DemandesATraiter[param_item.indice].oidrefuse="";
this.DemandesATraiter[param_item.indice].indiceRefus="0";
}
else
{
this.DemandesATraiter[param_item.indice].statut="1";
this.DemandesATraiter[param_item.indice].statutString="";
this.DemandesATraiter[param_item.indice].refuse="";
this.DemandesATraiter[param_item.indice].oidrefuse="";
this.DemandesATraiter[param_item.indice].indiceRefus="0";
}
this.DemandesATraiter[param_item.indice].checked=!param_item.checked;
}
}//updateDemande
traiterDemandes(){
}
} |
Ce que j'aimerai faire : dans la fonction select_item, quand le modal retourne une promesse, le checkbox de la ligne passe à true.
Le soucis que je rencontre, si le checkbox est à false (lors de l'ouverture de la page, les checkbox sont tous initialisés à false), il ne m'est pas possible de le faire passer à true par programmation, ce message d'erreur apparait :
Citation:
Runtime Error
ExpressionChangedAfterItHasBeenCheckedError : Expression has changed after it was checked. Previous value: 'true'? Current value: 'false'
Des idées de solution?
Merci
