A Potential Solution:
To tackle this issue, consider using the expand and reduce methods:
If we assume that the page index begins at 0, the initial page index prior to 'expand' should be one less than the starting page index retrieved from your service.
of({
isComplete: false,
pageIndex: -1,
items: []
}).pipe(
expand(data => this.employeeService.list(data.pageIndex+1, 100).pipe(
map(newData => ({...newData, pageIndex: data.pageIndex+1}))
)),
takeWhile(data => !(data.isComplete === true), true),
map(data => data.items),
reduce((acc, items) => ([...acc, ...items]))
).subscribe(res => {
this.employees = res;
});
An Informative Note on Promises:
observableStream.toPromise().then(LAMBDA);
is essentially similar to
observableStream.pipe(last()).subscribe(LAMBDA);
last waits for the completion of the source and only emits the final value, disregarding all other values in the stream.
Individuals new to working with Observables and Promises often initially believe it functions more like:
observableStream.pipe(first()).subscribe(LAMBDA);
where it takes the first value and promptly resolves the Promise with that value. However, this assumption is incorrect.
In essence, opting to use either Observables or Promises exclusively is recommended. Observable encompasses Promises and, aside from specific scenarios necessitating promises, transitioning an Observable into a Promise should typically not be necessary.