I am trying to get Userid and serviceId after I need to get a call based on the userid,serviceId problem here is it's not returning the observable to the ts.
Service.ts
function getData():observable<any>{
combineLatest([
this.activeSellService.getActiveSellServiceId(),
this.authService.getUserId(),
]).subscribe(([serviceId, userId]) => {
if (serviceId&& userId) {
const Url =
'users/' +
`${userId}` +
'/services/' +
`${serviceId}` +
'?value=test
return this.http.get<any>(this.endPoint.getUrl(encodeURI(Url)));
}
})
}
Component.ts:
this.service.getData().subscribe(data=>{console.log(data));
Even its not print the data in the console because the service is not returning observable. kindly help me out with this problem. else can we go with different solutions in rxjs?
try this out
function getData():observable<any>{
return combineLatest(
this.activeSellService.getActiveSellServiceId(),
this.authService.getUserId(),
).pipe(mergeMap([serviceId, userId]) => {
if (serviceId && userId) {
const Url =
'users/' +
`${userId}` +
'/services/' +
`${serviceId}` +
'?value=test
return this.http.get<any>(this.endPoint.getUrl(encodeURI(Url)));
}
})
}
note on the arguments of combinelatest and there is not subscription in getData
eg in stackblitz:
https://stackblitz.com/edit/angular-rxjs-combinelatest-hjyfa6?file=src/app/app.component.ts
You'd need to use a higher order mapping operator like switchMap to map from one observable to another. Moreover, the subscribe() function takes only callbacks and returns only the Subscription object that contains the subscription.
Also you aren't returning anything if the if condition fails. You could return an observable like RxJS constant EMPTY that immediately completes the subscription if the condition fails.
Furthermore
observable<any> must be Observable<any>function keyword isn't required in Typescript. Instead you could mention the scope identifier.combineLatest. In that case you could use forkJoin instead. However note that forkJoin only emits when all it's sources complete.Try the following
import { Observable, forkJoin, EMPTY } from 'rxjs';
import { switchMap } from 'rxjs/operators';
public getData(): Observable<any> {
return forkJoin([
this.activeSellService.getActiveSellServiceId(),
this.authService.getUserId(),
]).pipe(
switchMap(([serviceId, userId]) => {
if (!!serviceId && !!userId) {
const Url = `users/${userId}/services/${serviceId}?value=test`;
return this.http.get<any>(this.endPoint.getUrl(encodeURI(Url)));
} else {
return EMPTY;
}
})
);
}