Angular 5 (RxJS) - call array of subscriptions, then execute code
up vote
0
down vote
favorite
Response on my main subscription call returns an array of some values. These values are passed as arguments to array of my child subscriptions. In these subscriptions I want to assign values to dataArr - when subscription receives 'Not found' error, then I want to assign custom value. When all of the subscriptions are called then I want to execute final code after last subscription call.
Problem is I can't achieve it with forkJoin, because according to RxJS documentation "If an inner observable does not complete forkJoin will never emit a value!". I've tried merge and concat operators too. Any ideas?
this.service.get().subscribe(response => {
this.observables = ;
this.dataArr = ;
response.items.forEach(item => {
this.observables.push(this.otherService.get(item.data))
// I want this subscription to make this action
// this.otherService.get(item.data).subscribe(
// response => {
// this.dataArr.push({
// title: response.title,
// });
// },
// error => {
// this.dataArr.push({
// title: 'Not found!',
// });
// }
// )
});
Observable.forkJoin(this.observables).subscribe(
res => {
console.log(res)
}, err => {
console.log(err);
}, () => {
console.log('Completed!');
// execute other code on completion
}
);
});
angular rxjs
asked Nov 11 at 20:50
Johny
31
add a comment |
up vote
0
down vote
favorite
Response on my main subscription call returns an array of some values. These values are passed as arguments to array of my child subscriptions. In these subscriptions I want to assign values to dataArr - when subscription receives 'Not found' error, then I want to assign custom value. When all of the subscriptions are called then I want to execute final code after last subscription call.
Problem is I can't achieve it with forkJoin, because according to RxJS documentation "If an inner observable does not complete forkJoin will never emit a value!". I've tried merge and concat operators too. Any ideas?
this.service.get().subscribe(response => {
this.observables = ;
this.dataArr = ;
response.items.forEach(item => {
this.observables.push(this.otherService.get(item.data))
// I want this subscription to make this action
// this.otherService.get(item.data).subscribe(
// response => {
// this.dataArr.push({
// title: response.title,
// });
// },
// error => {
// this.dataArr.push({
// title: 'Not found!',
// });
// }
// )
});
Observable.forkJoin(this.observables).subscribe(
res => {
console.log(res)
}, err => {
console.log(err);
}, () => {
console.log('Completed!');
// execute other code on completion
}
);
});
angular rxjs
asked Nov 11 at 20:50
Johny
31
Could you elaborate your question.
– Sunil Singh
Nov 11 at 20:58
I want to call subscriptions one after another, push data to dataArr array on response or error (commented code) then after last subscription I want to execute some other code. Is this now understandable for you?
– Johny
Nov 11 at 21:56
add a comment |
up vote
0
down vote
favorite
up vote
0
down vote
favorite
Response on my main subscription call returns an array of some values. These values are passed as arguments to array of my child subscriptions. In these subscriptions I want to assign values to dataArr - when subscription receives 'Not found' error, then I want to assign custom value. When all of the subscriptions are called then I want to execute final code after last subscription call.
Problem is I can't achieve it with forkJoin, because according to RxJS documentation "If an inner observable does not complete forkJoin will never emit a value!". I've tried merge and concat operators too. Any ideas?
this.service.get().subscribe(response => {
this.observables = ;
this.dataArr = ;
response.items.forEach(item => {
this.observables.push(this.otherService.get(item.data))
// I want this subscription to make this action
// this.otherService.get(item.data).subscribe(
// response => {
// this.dataArr.push({
// title: response.title,
// });
// },
// error => {
// this.dataArr.push({
// title: 'Not found!',
// });
// }
// )
});
Observable.forkJoin(this.observables).subscribe(
res => {
console.log(res)
}, err => {
console.log(err);
}, () => {
console.log('Completed!');
// execute other code on completion
}
);
});
angular rxjs
asked Nov 11 at 20:50
Johny
31
Response on my main subscription call returns an array of some values. These values are passed as arguments to array of my child subscriptions. In these subscriptions I want to assign values to dataArr - when subscription receives 'Not found' error, then I want to assign custom value. When all of the subscriptions are called then I want to execute final code after last subscription call.
Problem is I can't achieve it with forkJoin, because according to RxJS documentation "If an inner observable does not complete forkJoin will never emit a value!". I've tried merge and concat operators too. Any ideas?
this.service.get().subscribe(response => {
this.observables = ;
this.dataArr = ;
response.items.forEach(item => {
this.observables.push(this.otherService.get(item.data))
// I want this subscription to make this action
// this.otherService.get(item.data).subscribe(
// response => {
// this.dataArr.push({
// title: response.title,
// });
// },
// error => {
// this.dataArr.push({
// title: 'Not found!',
// });
// }
// )
});
Observable.forkJoin(this.observables).subscribe(
res => {
console.log(res)
}, err => {
console.log(err);
}, () => {
console.log('Completed!');
// execute other code on completion
}
);
});
angular rxjs
angular rxjs
asked Nov 11 at 20:50
Johny
31
asked Nov 11 at 20:50
Johny
31
asked Nov 11 at 20:50
Johny
31
asked Nov 11 at 20:50
Johny
31
asked Nov 11 at 20:50
Johny
31
31
Could you elaborate your question.
– Sunil Singh
Nov 11 at 20:58
I want to call subscriptions one after another, push data to dataArr array on response or error (commented code) then after last subscription I want to execute some other code. Is this now understandable for you?
– Johny
Nov 11 at 21:56
add a comment |
Could you elaborate your question.
– Sunil Singh
Nov 11 at 20:58
I want to call subscriptions one after another, push data to dataArr array on response or error (commented code) then after last subscription I want to execute some other code. Is this now understandable for you?
– Johny
Nov 11 at 21:56
Could you elaborate your question.
– Sunil Singh
Nov 11 at 20:58
Could you elaborate your question.
– Sunil Singh
Nov 11 at 20:58
I want to call subscriptions one after another, push data to dataArr array on response or error (commented code) then after last subscription I want to execute some other code. Is this now understandable for you?
– Johny
Nov 11 at 21:56
I want to call subscriptions one after another, push data to dataArr array on response or error (commented code) then after last subscription I want to execute some other code. Is this now understandable for you?
– Johny
Nov 11 at 21:56
add a comment |
1 Answer
1
active
oldest
votes
up vote
0
down vote
accepted
You can use forkJoin!
https://www.learnrxjs.io/operators/combination/forkjoin.html
Be aware that if any of the inner observables supplied to forkJoin error you will lose the value of any other observables that would or have already completed if you do not catch the error correctly on the inner observable. If you are only concerned with all inner observables completing successfully you can catch the error on the outside.
So, just make sure that when an observable throws an error, it will still return something:
forkJoin(
this.service.observableA.pipe(
map(data => {
return { result: 'succes', data: data };
}),
catchError(err => {
console.log(err);
return of({ result: 'failed', data: null });
})
),
this.service.observableB.pipe(
map(data => {
return { result: 'succes', data: data };
}),
catchError(err => {
console.log(err);
return of({ result: 'failed', data: null });
})
)
).subscribe(
// This will be triggered even if one of the observables fail
);
Of course, in the subscribe method, you will need to inspect the list, and check if the 'result' properties is 'succes' or 'failed' for each returned response.
answered Nov 12 at 11:18
Davy
2,38641525
1
Changed catchError code to:catchError(error => of({ title: 'Not found!' }))And it works! Thank you very much :)
– Johny
Nov 12 at 12:56
Correct, catchError should indeed return an observable, i'll correct my answer
– Davy
Nov 12 at 13:14
add a comment |
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
up vote
0
down vote
accepted
You can use forkJoin!
https://www.learnrxjs.io/operators/combination/forkjoin.html
Be aware that if any of the inner observables supplied to forkJoin error you will lose the value of any other observables that would or have already completed if you do not catch the error correctly on the inner observable. If you are only concerned with all inner observables completing successfully you can catch the error on the outside.
So, just make sure that when an observable throws an error, it will still return something:
forkJoin(
this.service.observableA.pipe(
map(data => {
return { result: 'succes', data: data };
}),
catchError(err => {
console.log(err);
return of({ result: 'failed', data: null });
})
),
this.service.observableB.pipe(
map(data => {
return { result: 'succes', data: data };
}),
catchError(err => {
console.log(err);
return of({ result: 'failed', data: null });
})
)
).subscribe(
// This will be triggered even if one of the observables fail
);
Of course, in the subscribe method, you will need to inspect the list, and check if the 'result' properties is 'succes' or 'failed' for each returned response.
answered Nov 12 at 11:18
Davy
2,38641525
1
Changed catchError code to:catchError(error => of({ title: 'Not found!' }))And it works! Thank you very much :)
– Johny
Nov 12 at 12:56
Correct, catchError should indeed return an observable, i'll correct my answer
– Davy
Nov 12 at 13:14
add a comment |
up vote
0
down vote
accepted
You can use forkJoin!
https://www.learnrxjs.io/operators/combination/forkjoin.html
Be aware that if any of the inner observables supplied to forkJoin error you will lose the value of any other observables that would or have already completed if you do not catch the error correctly on the inner observable. If you are only concerned with all inner observables completing successfully you can catch the error on the outside.
So, just make sure that when an observable throws an error, it will still return something:
forkJoin(
this.service.observableA.pipe(
map(data => {
return { result: 'succes', data: data };
}),
catchError(err => {
console.log(err);
return of({ result: 'failed', data: null });
})
),
this.service.observableB.pipe(
map(data => {
return { result: 'succes', data: data };
}),
catchError(err => {
console.log(err);
return of({ result: 'failed', data: null });
})
)
).subscribe(
// This will be triggered even if one of the observables fail
);
Of course, in the subscribe method, you will need to inspect the list, and check if the 'result' properties is 'succes' or 'failed' for each returned response.
answered Nov 12 at 11:18
Davy
2,38641525
1
Changed catchError code to:catchError(error => of({ title: 'Not found!' }))And it works! Thank you very much :)
– Johny
Nov 12 at 12:56
Correct, catchError should indeed return an observable, i'll correct my answer
– Davy
Nov 12 at 13:14
add a comment |
up vote
0
down vote
accepted
up vote
0
down vote
accepted
You can use forkJoin!
https://www.learnrxjs.io/operators/combination/forkjoin.html
Be aware that if any of the inner observables supplied to forkJoin error you will lose the value of any other observables that would or have already completed if you do not catch the error correctly on the inner observable. If you are only concerned with all inner observables completing successfully you can catch the error on the outside.
So, just make sure that when an observable throws an error, it will still return something:
forkJoin(
this.service.observableA.pipe(
map(data => {
return { result: 'succes', data: data };
}),
catchError(err => {
console.log(err);
return of({ result: 'failed', data: null });
})
),
this.service.observableB.pipe(
map(data => {
return { result: 'succes', data: data };
}),
catchError(err => {
console.log(err);
return of({ result: 'failed', data: null });
})
)
).subscribe(
// This will be triggered even if one of the observables fail
);
Of course, in the subscribe method, you will need to inspect the list, and check if the 'result' properties is 'succes' or 'failed' for each returned response.
answered Nov 12 at 11:18
Davy
2,38641525
You can use forkJoin!
https://www.learnrxjs.io/operators/combination/forkjoin.html
Be aware that if any of the inner observables supplied to forkJoin error you will lose the value of any other observables that would or have already completed if you do not catch the error correctly on the inner observable. If you are only concerned with all inner observables completing successfully you can catch the error on the outside.
So, just make sure that when an observable throws an error, it will still return something:
forkJoin(
this.service.observableA.pipe(
map(data => {
return { result: 'succes', data: data };
}),
catchError(err => {
console.log(err);
return of({ result: 'failed', data: null });
})
),
this.service.observableB.pipe(
map(data => {
return { result: 'succes', data: data };
}),
catchError(err => {
console.log(err);
return of({ result: 'failed', data: null });
})
)
).subscribe(
// This will be triggered even if one of the observables fail
);
Of course, in the subscribe method, you will need to inspect the list, and check if the 'result' properties is 'succes' or 'failed' for each returned response.
answered Nov 12 at 11:18
Davy
2,38641525
edited Nov 12 at 13:14
answered Nov 12 at 11:18
Davy
2,38641525
answered Nov 12 at 11:18
Davy
2,38641525
answered Nov 12 at 11:18
Davy
2,38641525
2,38641525
1
Changed catchError code to:catchError(error => of({ title: 'Not found!' }))And it works! Thank you very much :)
– Johny
Nov 12 at 12:56
Correct, catchError should indeed return an observable, i'll correct my answer
– Davy
Nov 12 at 13:14
add a comment |
1
Changed catchError code to:catchError(error => of({ title: 'Not found!' }))And it works! Thank you very much :)
– Johny
Nov 12 at 12:56
Correct, catchError should indeed return an observable, i'll correct my answer
– Davy
Nov 12 at 13:14
1
1
Changed catchError code to:
catchError(error => of({ title: 'Not found!' })) And it works! Thank you very much :)– Johny
Nov 12 at 12:56
Changed catchError code to:
catchError(error => of({ title: 'Not found!' })) And it works! Thank you very much :)– Johny
Nov 12 at 12:56
Correct, catchError should indeed return an observable, i'll correct my answer
– Davy
Nov 12 at 13:14
Correct, catchError should indeed return an observable, i'll correct my answer
– Davy
Nov 12 at 13:14
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Some of your past answers have not been well-received, and you're in danger of being blocked from answering.
Please pay close attention to the following guidance:
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53253100%2fangular-5-rxjs-call-array-of-subscriptions-then-execute-code%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Could you elaborate your question.
– Sunil Singh
Nov 11 at 20:58
I want to call subscriptions one after another, push data to dataArr array on response or error (commented code) then after last subscription I want to execute some other code. Is this now understandable for you?
– Johny
Nov 11 at 21:56