I'm relatively new to RxJs and am unable to chain a single operation after processing multiple items emitted using switchMap operator.
Scenario: use backend data to generate an object array for a dropdownlist, then chain a single operation to set the dropdown's selected value.
Here's the non-working code that helps illustrate the problem.
this.sub = this.dataService.getUserData()
.switchMap((data) => Observable.from(data)) // create new data stream from inner data set
.map((data: any) => {
return { value: data._id, viewValue: data.firstName + ' ' + data.lastName };
}) // create data structure for drop down
.subscribe( (data) => {
this.userDropDown.push(data); // this operation needs to run once per item emitted, and is working
this.patchFormData(); // <-- However, this only needs to run once
},
(error) => console.log("error", error)
);
I've tried various operators that morph the problem but am unable to solve the entirety of the issue i.e. a) get new object array based off the source data and b) run a single operation after completion.
Any help greatly appreciated.
Thank you,
- S. Arora
-- UPDATE: working final version is here based on answer below with minor syntax fix:
this.sub = this.dataService.getUserData()
.map((data: any[]) => {
return data.map((x: any) => {
return { value: x._id, viewValue: x.firstName + ' ' + x.lastName };
});
})
.subscribe((data: any) => {
this.userDropDown = data;
this.patchFormData();
},
(error) => console.log("error", error)
);