Tengo una aplicación que establece una conexión con Firebase realtime db, a través de authWithCustomToken y obtiene algunos datos.

El flujo es el siguiente:

El componente principal => activa el Servicio (establece la conexión) => El principal recibe datos del Servicio y los envía al componente secundario a través del enlace. El componente secundario tiene un enlace de ciclo de vida onChanges para reaccionar en la actualización del enlace.

Problema: onChange no se activa cuando se actualiza el enlace

Servicio:

 ... self.data = null; self.authenticate = function() { return $http.get('/api/v2/fbtoken') .then(function(res) { const ref = new Firebase(firebaseBaseUrl); return ref.authWithCustomToken( res.data, saveData(error, authData); ); }); }; function saveData(error, authData) { if(error) { return false; } self.data = authData; return true; } self.getData() { return self.data; }

padre.componente.html:

 <child-component notification-list="ParentCtrl.notifications"></child-component notification-list>

padre.componente.js:

 ... function ParentCtrl( Service ) { const viewModel = this; viewModel.notifications = null; Service.authenticate() .then((data) => { viewModel.notifications = Service.getData(); }); }

niño.componente.js:

 ... .component('childComponent', { bindings: { notificationList: '<' }, templateUrl: 'someUrl', controller: 'ChildCtrl as ChildCtrl' }) ... function ChildCtrl() { const viewModel = this; viewModel.$onChanges = onChanges; function onChanges(changes) { if (changes) { // Not triggered console.log('binding has changed'); } } }

Sé que AngularJS no sabe nada sobre Promise nativo y no se activa la detección de cambios. Para forzar changeDetection, necesitamos usar la biblioteca $q para eso. Pero este ejemplo usa el cliente AngularJS $http que devuelve $q.promise.

La biblioteca Wrapper Angularfire para el cliente de Firebase también devuelve una promesa de $q bajo el capó:

 FirebaseAuth = function($q, $firebaseUtils, ref) { this._q = $q; ... authWithCustomToken: function(authToken, options) { var deferred = this._q.defer(); try { this._ref.authWithCustomToken(authToken, this._utils.makeNodeResolver(deferred), options); } catch (error) { deferred.reject(error); } return deferred.promise; }

Si para comentar parte con authWithCustomToken => se activa la detección de cambios, se cambia la variable en el elemento principal, se actualiza el enlace en el elemento secundario y también se activa el gancho onChanges.

Pero con la parte authWithCustomToken, la variable en Parent se cambia, pero este cambio no se refleja en el enlace del niño y el gancho onChanges no se activa.

¿Que me estoy perdiendo aqui?