问题描述
我正在尝试在 ion-texarea 中打印选中复选框的名称。该应用程序要求输入名称、流派(男性、女性)和描述(高、小、聪明、丑等),底部有一个 ion-textarea 可打印如下句子,名称 是流派,她/他是选中复选框的描述。 前任。 约翰是个男人,他又高又聪明又丑。
我拥有的 html 代码是:
<ion-item>
<ion-label color="primary">Genre</ion-label>
<ion-list>
<ion-item *ngFor="let genre of genre">
<ion-label>{{genre.name}}</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>
打字稿代码为:
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;
解决方法
我猜你还没有添加完整的代码。甚至描述值也没有令人失望。无论如何,我对您的代码进行了修改,以便您可以获得已检查内容的值。它可能会帮助您继续。
目前您的文本区域显示为 [object] 类型的输出。
尝试重构您的代码,如下所述。所以你可以得到检查的值。但是,一旦选中复选框,请确保禁用当前部分上的其他复选框。复选框。
gen() {
this.genre.forEach(item => {
if(item.isChecked == true){
this.genero = item;
return;
}
})
}
result() {
this.critica = this.genero.name;
}