What method should be called instead of subscribe in rxjs after flatMaps when there is no stream to be passed through?

Question

I have a method takes it part of form management and does the things below. I can solve a case like this with promises easily, but here is the time to learn observables! So, the tasks of the method:

• calls clientWebApiService.getClients() to get clients list, and returns observable of environmentWebApiService.getEnvironmentsNotInPipeline()
• in the second flatMap the result will be passed to local variable
• in the subscribe I would like to map a data structure another to be able to setup things of a form

The subscribe() throws the error below:

ERROR TypeError: You provided 'undefined' where a stream was expected. You can provide an Observable, Promise, Array, or Iterable.
    at Object.subscribeToResult (subscribeToResult.js:73)
    at MergeMapSubscriber._innerSub (mergeMap.js:130)
    at MergeMapSubscriber._tryNext (mergeMap.js:127)

I already (hopefully) figured out that subscribe expects a stream which is not provided here. If I see correctly the second flatMap should return an Observable which is processed by the subscribe(). In this structure there will be no. In this case what method should be called? I found the rxjs documentation with lot of methods. I don't know which one I'm looking for.

I have tried to restructure my code, but if there is no subscribe(), then there is no execution.

• what is the best practice case like this?

public editHandler({ dataItem }): void {

        let clients: IClientContract[];
        let environments: IEnvironmentContract[];

        this.clientWebApiService.getClients()
            .flatMap((clientsResult: any): Observable<IEnvironmentContract[]> => {
                clients = clientsResult as IClientContract[];
                console.log('1', clients);
                return this.environmentWebApiService.getEnvironmentsNotInPipeline();
            })
            .flatMap((environmentResult: IEnvironmentContract[]): any => {
                environments = environmentResult;
                console.log('2', environments);
            })
            .subscribe(() => {
                console.log('3');
                let editableDeploymentItem: IDeployableEnvironmentForm = this.deployableEnvironmentContractMapperService
                    .mapDeployableEnvironmentContractToDeployableEnvironmentForm(
                    dataItem,
                    clients,
                    environments);
                console.log('4', editableDeploymentItem);

                this.editDeployment = editableDeploymentItem;
                this.isNew = false;
            });
    }

Answer 1

You should use do. do operator just performs an action and continues the steam. In your case, I dont see why you need another operator as it can be done in the subscribe method itself.

You can just do :

public editHandler({ dataItem }): void {

        let clients: IClientContract[];
        let environments: IEnvironmentContract[];

        this.clientWebApiService.getClients()
            .flatMap((clientsResult: any): Observable<IEnvironmentContract[]> => {
                clients = clientsResult as IClientContract[];
                console.log('1', clients);
                return this.environmentWebApiService.getEnvironmentsNotInPipeline();
            })
            .subscribe((environmentResult: IEnvironmentContract[]): any => {
                environments = environmentResult;
                console.log('2', environments);
                console.log('3');
                let editableDeploymentItem: IDeployableEnvironmentForm = this.deployableEnvironmentContractMapperService
                    .mapDeployableEnvironmentContractToDeployableEnvironmentForm(
                    dataItem,
                    clients,
                    environments);
                console.log('4', editableDeploymentItem);

                this.editDeployment = editableDeploymentItem;
                this.isNew = false;
            });
    }

Answer 2

Instead using this.clientWebApiService.getClients().flatMap(() => {}) Could you give it a try by useing this.clientWebApiService.getClients().map(() => {})?

Read this may help