samedi 20 mars 2021

Print the name of a checkbox in ion-textarea if checked. on IONIC

im trying to print the name of checked checkboxes in an ion-texarea. The app ask for the name, the genre(masculine, femenine) and description(tall, small, smart, ugly, etc.), at the bottom there's an ion-textarea to print a sentence like, Name is a genre and She/He is description of checked checkboxes. ex. John is a Man and he is Tall, Smart, and Ugly.

Image of the App

the html code i have is:

<ion-item>
      <ion-label color="primary">Genre</ion-label>
      <ion-list>
        <ion-item *ngFor="let genre of genre"> 
          <ion-label></ion-label>
          <ion-checkbox slot="end" [(ngModel)]="genre.isChecked"></ion-checkbox>
        </ion-item>
      </ion-list>
    </ion-item>
    <ion-list-header>
    <ion-label color="primary">Descripcion</ion-label>
  </ion-list-header>
 
<div>
  <ion-col><ion-button expand="full"  (click)="gen(); result()" >Criticar</ion-button></ion-col>
  <ion-textarea [ngModel]="critica"></ion-textarea>
</div>

the typescript code is:

export class HomePage {
nombre:string;
genero:any;
critica:any;

genre: any=[
    {name:'Masculino', isChecked: false},
    {name:'Femenino', isChecked: false}
];

gen(){
    this.genero=this.genre.filter(value => {return value.isChecked});

  result(){
    this.critica = this.genero;



Aucun commentaire:

Enregistrer un commentaire