Me estoy suscribiendo a un observable para que cada vez que falle mi llamada subscribeToTasks()
en mi servicio, finalmente invoque el código en mi método subscribeToTasks( subscriptionError()
de mi componente, que en este ejemplo es solo una alerta simple. El problema es que cada vez que se produce un error en esta llamada y se invoca this.newSubscriptionFailure.next()
, aparece el siguiente error en la consola de mi navegador:
No se puede leer la propiedad 'siguiente' de indefinido
¿Cómo es que newSubscriptionFailure
no está definido cuando puede verlo claramente definido sobre el método? Ese código debería recibir un golpe mucho antes de que ocurra el error en la llamada a la API. He usado este enfoque en el pasado y siempre ha funcionado, la única diferencia que se me ocurre es que estoy llamando a .next()
en el servicio (el mismo archivo que se define newSubscriptionFailure
) mientras que normalmente llamo a .next()
en un archivo de componente separado. ¿Qué estoy haciendo mal? ¿Hay alguna manera en que pueda hacer que esto funcione, o un mejor enfoque a seguir?
Código de mi servicio:
import { Observable } from 'rxjs/Observable'; import { Subject } from 'rxjs/Subject'; public subscribeToTasks(period: string, stripeToken: string): Observable<any> { let body = JSON.stringify({ period, stripeToken }); let headers = new Headers({ 'Content-Type': 'application/json' }); let options = new RequestOptions({ headers: headers }); return this.authHttp.post(this.apiTasks, body, options).map(response => { return response.json(); }).catch(this.newSubscriptionError); } newSubscriptionFailure = new Subject(); newSubscriptionFailure$ = this.newSubscriptionFailure.asObservable(); public newSubscriptionError() { this.newSubscriptionFailure.next(); }
código de mi componente:
ngOnInit(): void { this.subscriptionError(); } subscriptionError(){ this.subscriptionsService.newSubscriptionFailure$.subscribe(() => { alert('call failed'); }); }
Cambio
}).catch(this.newSubscriptionError);
a
}).catch((e)=>this.newSubscriptionError());
o
}).catch(this.newSubscriptionError.bind(this));
this
no se refiere al Injectable
de lo contrario
En caso de que alguien más tenga el mismo problema que yo tuve. Estaba usando un asunto llamado this.destroy$ al que invoco a continuación en el método OnDestroy. Usándolo en el observable suscrito como: .takeUntil(this.destroyed$)
. Había olvidado inicializar este objeto destroy$. Después de usar destroy$: Subject<any> = new Subject<any>();
el error se fue.