@Maaar97 wrote:
Hi
I’m trying to open an ion-datetime but it doesn’t work, doesn’t show anything, errors neither.
I tried using the ion-datetime out of ion-item and it shows and error, but i don’t want to use it like thatI’m using an api to get the data, and in the page where i put the ion-datetime might be different components, i don’t know if that affects the way it should works or something (my objects and function names are in spanish, sorry)
If you can help me, it’d help me a lot
My HTML code is:
<app-header-secundario Titulo="Agregar Actividad" SubTitulo="{{ actividad }}"></app-header-secundario> <ion-content padding> <ion-item (click)=seleccionarActividad($event)> <ion-label *ngIf="actividad===''" >Seleccione qué actividad desea agregar</ion-label> <ion-label *ngIf="actividad!=''" text-capitalize>{{ actividad }}</ion-label> <ion-icon slot="end" name="arrow-dropdown"></ion-icon> </ion-item> <ion-row> <ion-col *ngIf="actividad==='tarea'" size="12"> <ion-item> <ion-label position="floating" color="celeste" required>Título de la Tarea</ion-label> <ion-input name="tituloTarea" [(ngModel)]="tarea.titulo" clearInput></ion-input> </ion-item> <ion-item> <ion-label position="floating" color="celeste">Descripcion de la Tarea</ion-label> <ion-textarea name="descripcionTarea" [(ngModel)]="tarea.contenido" rows="6"></ion-textarea> </ion-item> <!-- <ion-item> <ion-label color="celeste">Fecha de Entrega</ion-label> <ion-datetime display-format="DDDD DD/MM/YYYY" picker-format="DD MMMM YYYY" doneText="Aceptar" min="01-01-2019" max="08-05-2019" placeholder="Seleccione Fecha" dayShortNames={{diasCorto}} dayNames={{diasCompleto}} monthNames={{mesesCompleto}} monthShortNames={{mesesCorto}} name="fechaTarea" [(ngModel)]="tarea.fecha_entrega"> </ion-datetime> </ion-item> --> <ion-item> <ion-label>Date</ion-label> <ion-datetime displayFormat="DD/MM/YYYY" pickerFormat="DD MMMM YYYY" [(ngModel)]="tarea.fecha_entrega"></ion-datetime> </ion-item> </ion-col> <ion-col *ngIf="actividad==='evento'" size="12"> <ion-item> <ion-label position="floating" color="celeste" required>Título del Evento</ion-label> <ion-input name="tituloEvento" [(ngModel)]="evento.titulo" clearInput></ion-input> </ion-item> <ion-item> <ion-label position="floating" color="celeste">Descripcion del Evento</ion-label> <ion-textarea name="descripcionEvento" [(ngModel)]="evento.contenido" rows="6"></ion-textarea> </ion-item> <ion-item> <ion-label color="celeste">Fecha de Inicio</ion-label> <ion-datetime display-format="DDDD DD/MM/YYYY" picker-format="DD MMMM YYYY" doneText="Aceptar" min="01-01-2019" max="08-05-2019" placeholder="Seleccione Fecha" dayShortNames={{diasCorto}} dayNames={{diasCompleto}} monthNames={{mesesCompleto}} monthShortNames={{mesesCorto}} name="fechaEvento1" [(ngModel)]="evento.fecha_inicio"> </ion-datetime> </ion-item> <ion-item> <ion-label color="celeste">Fecha de Finalizacion</ion-label> <ion-datetime display-format="DDDD DD/MM/YYYY" picker-format="DD MMMM YYYY" doneText="Aceptar" min="01-01-2019" max="08-05-2019" placeholder="Seleccione Fecha" dayShortNames={{diasCorto}} dayNames={{diasCompleto}} monthNames={{mesesCompleto}} monthShortNames={{mesesCorto}} name="fechaEvento2" [(ngModel)]="evento.fecha_fin"> </ion-datetime> </ion-item> </ion-col> <ion-col *ngIf="actividad==='examen'" size="12"> <ion-item> <ion-label position="floating" color="celeste" required>Examen</ion-label> <ion-input name="tituloExamen" [(ngModel)]="examen.titulo" clearInput></ion-input> </ion-item> <ion-item> <ion-label color="celeste">Fecha de Realizacion</ion-label> <ion-datetime display-format="DDDD DD/MM/YYYY" picker-format="DD MMMM YYYY" doneText="Aceptar" min="01-01-2019" max="08-05-2019" placeholder="Seleccione Fecha" dayShortNames={{diasCorto}} dayNames={{diasCompleto}} monthNames={{mesesCompleto}} monthShortNames={{mesesCorto}} name="fechaExamen" [(ngModel)]="examen.fecha"> </ion-datetime> </ion-item> </ion-col> <ion-col *ngIf="actividad!=''" size="6" offset="3"> <ion-button color="celeste" (click)="agregarActividad()"> Agregar Actividad </ion-button> </ion-col> </ion-row> </ion-content>And my .ts file is
actividad = ''; json: JSON; idCurso: string; nombreCurso: string; token: string; tarea: any = { idUsuario: '', idCurso: '', titulo: '', contenido: '', fecha_entrega: '' } examen: any = { idUsuario: '', idCurso: '', titulo: '', contenido: '', tipo_examen: '', fecha: '' } evento: any = { idUsuario: '', idCurso: '', titulo: '', contenido: '', fecha_inicio: '', fecha_fin: '' } mesesCorto=['Ene','Feb','Mar','Abr','May','Jun','Jul','Ago','Sep','Oct','Nov','Dic']; mesesCompleto=['Enero','Febrero','Marzo','Abril','Mayo','Junio','Julio','Agosto','Septiembre','Octubre','Noviembre','Diciembre']; diasCorto=['Lun','Mar','Mie','Jue','Vie','Sab','Dom']; diasCompleto=['Lunes','Martes','Miercoles','Jueves','Viernes','Sabado','Domingo']; constructor(private cursoService: CursoService, private popoverCtrl: PopoverController, private toastCtrl: ToastController, private navCtrl: NavController, private ruta: ActivatedRoute, private storage: Storage) { } ngOnInit() { this.idCurso = this.ruta.snapshot.paramMap.get('idC'); this.nombreCurso = this.ruta.snapshot.paramMap.get('nombre'); this.storage.get('TOKEN').then(token => { this.token = token; }); this.storage.get('ID').then(idU => { this.tarea.idUsuario = idU; this.examen.idUsuario = idU; this.evento.idUsuario = idU; }); this.tarea.idCurso = this.idCurso; this.examen.idCurso = this.idCurso; this.evento.idCurso = this.idCurso; } generarJSON(){ if(this.actividad === 'tarea') { this.json = <JSON>this.tarea; } else if(this.actividad === 'evento') { this.json = <JSON>this.evento; } else if(this.actividad === 'examen') { this.json = <JSON>this.examen; } console.log(this.json); } async seleccionarActividad(event){ const popover = await this.popoverCtrl.create({ component: OpcionActividadComponent, event, mode: 'ios', backdropDismiss: false }); await popover.present(); const {data} = await popover.onWillDismiss(); this.actividad = data.actividad; }
Posts: 1
Participants: 1