我对ionic并不陌生,当将数据与api集成时,这是一项复杂的任务,我想点击任意按钮并选择任何表情符号,并希望在替换所选按钮时代表该数据。
Api已集成
home.ts page
async showReactions(ev:any){
console.log("you have clicked the button");
const reactions = await this.popoverCtrl.create({
component:ReactionComponent,
event:ev,
cssClass: 'contact-popover',
backdropDismiss: false,
showBackdrop:true,
componentProps: {viewtype : this.viewtype}
});
reactions.onDidDismiss().then((dataReturned)=>{
if (dataReturned!==null){
this.dataReturned=dataReturned.data;
console.log(dataReturned);
}
console.log('button is dismissed');
});
return await reactions.present( );
}
home.html
<ion-button (click)="showReactions($event)" >
<div>Like</div>
<div *ngIf="dataReturned">
<img src="{{dataReturned.post_excerpt}}" />
</div>
</ion-button>
reaction.ts
like(r)
{
let data =r;
console.log("you have reacted");
this.popCtrl.dismiss(data)
}
reaction.html
<div (click)="like(r)" *ngFor="let r of reactions" >
<img src="{{r.post_excerpt}}">