Tutorial Ionic Framework - Capítulo 14: Guardado persistente de datos
Aquí están los 3 últimos vídeos del curso, donde verás como utilizar localstorage para guardar datos de forma persistente en tu aplicación, para que se mantengan ahí al volver a abrir la aplicación después de cerrarla, o al hacer un refresh cuando lo miramos a través del navegador.
Parte 1
Parte 2
Parte 3
Código
En este repositorio de github te podrás bajar el código de la aplicación, para jugar con ella.
Recuerda que para ejecutar la aplicación en tu dispositivo, tendrás que añadir la plataforma que quieres (android / iOS) y ejecutar la app, desde la consola de ionic:
$ ionic platform add android $ ionic run android
Espero que lo hayas disfrutado, ¡¡saludos!!
¿Te ha gustado este artículo? No te cortes, déjame un comentario y ayúdame a compartirlo 😉
Comentarios
Para comentar necesitas una cuenta de GitHub.
4 comentarios del blog anterior
Fernando del Corro · 28 jul 2016
Primera vez que dejo un comentario en un tutorial, la verdad, muy bien explicado. Sólo faltaría indicar como hacer un POST.
Muchas gracias.
Enrique Oriol · 1 ago 2016
Gracias!! Me alegro de que te haya gustado ;)
David Pereira · 23 nov 2018
Hola como hago para persistir los eventos de in calendario ionic, la verdad logré que se guardaran en el localstorage pero cuando recargo la página no quedan marcados en el calendario.
Este es mi código:
export class HomePage {
eventSource = [];
titulo: string;
diaSeleccionado = new Date();
calendar = {
mode: 'month',
currentDate: new Date()
};
constructor(public navCtrl: NavController, private modalCtrl: ModalController, private alertCtrl: AlertController, public calService: CalendarService) {
this.calService.cargarStorage(this.eventSource);
}
// Agrega un evento
addEvent() {
let modal = this.modalCtrl.create('EventModalPage', {diaSeleccionado: this.diaSeleccionado});
modal.present();
modal.onDidDismiss(data => {
if (data) {
let eventData = data;
this.calService.cargarStorage(this.eventSource);
eventData.startTime = new Date(data.startTime);
eventData.endTime = new Date(data.endTime);
let events = this.eventSource;
events.push(eventData);
this.eventSource = [];
setTimeout(() => {
this.eventSource = events;
this.calService.guardarStorage(this.eventSource);
});
}
});
}
}
---------------------------------------------
Los métodos guardarStorage y cargarStorage los creé en un archivo de servicios aparte, este es el código.
guardarStorage(eventos){
localStorage.setItem('data', JSON.stringify(eventos));
}
cargarStorage(eventos){
if(localStorage.getItem('data')){
eventos= JSON.parse(localStorage.getItem('data'));
}else{
eventos= [];
}
}
David Pereira · 23 nov 2018
O tal vez si me puedes dejar el fragmento de codigo de algún ejemplo se lo agradecería mucho :)