Si estás usando un método .then
lo más probable es que el objeto que lo antecede es un thenable(o un objeto que tiene un método then). Usualmente quien implementa este tipo de método son las Promesas. Mirando tu código más de cerca tenemos
datosGrupos: function() {
var getGrupos, infoGrupos;
getGrupos = localStorage.getItem('GruposProf');
infoGrupos = JSON.parse(getGrupos);
return infoGrupos;
}
al que luego llamas
obtenerGruposProf.datosGrupos().then(//....
El error ocurre porque la función datosGrupos
no devuelve una promesa y por lo tanto no hay un método .then
. Lo que devuelve esa función como tal es el dato que tienes en el localStorage, un objeto común y corriente.
Para que te devuelva una promesa debes hacer algo como
angular.module('gruposProfesor', ['ionic', 'ngCordova'])
.factory('obtenerGruposProf', obtenerGruposProf);
obtenerGruposProf.$inject = ['$q'];
function obtenerGruposProf($q) {
return {
datosGrupos: function() {
var defer = $q.defer();
// creas un objeto Deferred que tiene un método resolve y reject
var getGrupos, infoGrupos;
getGrupos = localStorage.getItem('GruposProf');
infoGrupos = JSON.parse(getGrupos);
// resuelves la promesa con el valor obtenido
defer.resolve(infoGrupos) ;
// devuelves el .promise que es el que tiene el método then
return defer.promise;
}
};
}
Básicamente estarías devolviendo una promesa con el resultado futuro ya resuelto. Esto es un error por dos razones
Estás creando asincronía en una operación que es inevitablemente sincrónica.
Las operaciones en localStorage son sincrónicas. El método getItem devuelve inmediatamente un string, o sea el resultado de la operación, no un resultado futuro.
Es mucho más simple escribir
var data = obtenerGruposProf.datosGrupos();
console.log(data);
que escribir
obtenerGruposProf.datosGrupos().then(function(data) {
console.log(data);
});
ya que estás creando anidamiento innecesario. Esto te pone un paso mas cerca del callback-hell el cual es una de las razones por las que existen las promesas.
Usualmente escribir las promesas de esa forma es considerado un antipatrón ya que
Las promesas sirven para hacer que el código asíncronico retenga la mayor parte de las propiedades perdidas del código sincrónico tales como indentación plana y un sólo canal para los errores.
Como viste anteriormente no necesitas crear indentación y en caso de error puedes usar un simple try...catch
En el antipatrón Deferred, los objetos "deferred" son creados sin motivo, complicando el código.
Hay un caso en el que sí te conviene escribir el código de esta forma y es cuando, por ejemplo, tienes que hacer una llamada ajax o devolver un resultado almacenado ya. Básicamente tienes dos opciones, una es sincrónica y la otra asincrónica. En este caso puedes hacer esto.
angular.module('gruposProfesor', ['ionic', 'ngCordova'])
.factory('obtenerGruposProf', obtenerGruposProf);
obtenerGruposProf.$inject = ['$q', '$http'];
function obtenerGruposProf($q, $http) {
return {
datosGrupos: function() {
var getGrupos, infoGrupos;
getGrupos = localStorage.getItem('GruposProf');
if (getGrupos) {
infoGrupos = JSON.parse(getGrupos);
var defer = $q.defer();
defer.resolve(infoGrupos);
return defer.promise;
} else {
return $http.get('/miapi/gruposprof');
}
}
};
}
Luego manipulas tus datos usando
obtenerGruposProf.datosGrupos().then(function(data) {
localStorage.setItem('GruposProf', JSON.stringify(data));
console.log(data);
});
En este caso el deferred si es necesario ya que no puedes saber con seguridad si la llamada será asincrónica o no y el uso del .then
está plenamente justificado.
Por último ten en cuenta que si lo que quieres es cachear el resultado de tus llamadas ajax en el localStorage ya existe un servicio para hacer eso.
Échale un vistazo a https://github.com/jmdobry/angular-cache.
datosGrupos
no tiene un métodothen
.obtenerHorarioProf.datosHorario().then(function(informacion) {});
Este es otro factory para llamar el horario del profesor, la verdad es igual por decirlo asi