Tengo que implementar unos test en ionic, las preguntas para estos test las recogo de la base de datos y las muestro. El problema lo tengo al recoger los datos.
Para empezar guardo los datos de las preguntas en un array
de objetos PreguntasTest
que tiene los siguientes atributos.
id: string;
tporden : number;
testId: string;
tptexto_es: string
tptexto_eu: string
Esta lista la muestro en el Html
junto con los radio
con sus respuestas.
<ion-content>
<form (ngSubmit)="enviarRespuestas()" id="form_test" >
<ion-list>
<div >
<div class="hilo" *ngFor="let preguntas of listaPreguntas; let i = index" >
<div class="cabeceraTest" *ngIf="translate.currentLang=='es'" >
<h5>{{preguntas.tptexto_es}} </h5>
</div>
<div class="cabeceraTest" *ngIf="translate.currentLang=='eu'" >
<h5> {{preguntas.tptexto_eu}} </h5>
</div>
<div class="opciones" >
<ion-input type="text" hidden="true" value={{preguntas.id}} name="id_pregunta" ></ion-input>
<ion-list radio-group name="valor">
<ion-item>
<ion-label>{{'test.si' | translate}}</ion-label>
<ion-radio value="1" ></ion-radio>
</ion-item>
<ion-item>
<ion-label>{{'test.no' | translate}}</ion-label>
<ion-radio value="0" ></ion-radio>
</ion-item>
</ion-list>
</div>
</div>
</div>
</ion-list>
</form>
He eliminado las etiquetas del tipo formGroup
o formGroupName
ya que todo me esta dando errores y/o no recoge los datos de la forma adecuada.
Mi intencion es recoger los datos con la siguiente estructura:
respuestas{
respuesta{
id_pregunta:1,
respuesta:0
},
respuesta{
id_pregunta:2,
respuesta:0
},...
}
Este es el componente que hay detrás del html, tiene mucha basura de las pruebas que he realizado, así que gran parte del código es basura.
@Component({
selector: 'page-testPreguntas',
templateUrl: 'test-preguntas.html'
})
export class TestPreguntasPage {
indice: number;
listaPreguntas: PreguntasTest[];
cargarMas: boolean;
test : Test;
formulario : FormGroup;
constructor(public navCtrl: NavController, public navParams: NavParams,public menuCtrl: MenuController,
public global: GlobalVars, public platform: Platform, public translate: TranslateService,
public testService: TestService,private auth: AuthService,
public formBuilder: FormBuilder
) {
this.formulario = this.formBuilder.group({
questions: formBuilder.array([])
})
platform.ready().then(() => {
//para actualizar los colores del idioma
global.actualizaIdioma();
this.translate.onLangChange.subscribe((event: LangChangeEvent) => {
//cambiamos el idioma de los títulos de los temas
this.cambiarLenguajeTitulo();
});
});
this.test = navParams.get('test');
this.cambiarLenguajeTitulo();
this.indice = 0;
this.cargarMas = false;
this.cargarPreguntas()
}
/*private createMyForm(){
return this.formBuilder.group({
})
}*/
enviarRespuestas(){
console.log("METODO ENVIAR RESPUESTAS");
console.log(this.formulario.value)
//console.log(this.formulario.controls[0].value);
}
cargarPreguntas(){
// ESTE CODIGO RECOGE LOS DATOS DEL SERVER Y LOS GUARDA EN listaPreguntas
}
openMenu(){
this.menuCtrl.open();
}
cambiarLenguajeTitulo(){
if(this.translate.currentLang=="es"){
this.test.titulo = this.test.tetitulo_es;
}else{
this.test.titulo = this.test.tetitulo_eu;
}
}
}