Question:

I am getting below set of data via Observable

[ 0: {id: "12321", itemName: "Item 1", category: "All"}, 1: [ 0: {id: "423423", itemName: "Sub Item 1", category: "subcat"}, 1: {id: "413212", itemName: "Sub Item 2", category: "subcat"} ], 2: {id: "65655", itemName: "Item 2", category: "All"}, 3: {id: "87877", itemName: "Item 3", category: "All"}, 4: [ 0: {id: "354345", itemName: "Sub Item 1", category: "subcat"}, 1: {id: "123434", itemName: "Sub Item 2", category: "subcat"}, 2: {id: "765767", itemName: "Sub Item 3", category: "subcat"}, 3: {id: "854643", itemName: "Sub Item 4", category: "subcat"}, ] ]

I am trying to move all the objects within array to root array. The expected result is

[ 0: {id: "12321", itemName: "Item 1", category: "All"}, 1: {id: "423423", itemName: "Sub Item 1", category: "subcat"}, 2: {id: "413212", itemName: "Sub Item 2", category: "subcat"} 3: {id: "65655", itemName: "Item 2", category: "All"}, 4: {id: "87877", itemName: "Item 3", category: "All"}, 5: {id: "354345", itemName: "Sub Item 1", category: "subcat"}, 6: {id: "123434", itemName: "Sub Item 2", category: "subcat"}, 7: {id: "765767", itemName: "Sub Item 3", category: "subcat"}, 8: {id: "854643", itemName: "Sub Item 4", category: "subcat"}, ]

<strong>This is how the data looks on console</strong>

<a href="https://i.stack.imgur.com/tu7UM.png" rel="nofollow"><img alt="Data Sample" class="b-lazy" data-src="https://i.stack.imgur.com/tu7UM.png" data-original="https://i.stack.imgur.com/tu7UM.png" src="https://etrip.eimg.top/images/2019/05/07/timg.gif" /></a>

Below is what I've and tried so far.

lstCategories: Observable<any>; this.lstCategories = ..... .flatMap(records => Observable.combineLatest(records)) .map(da => { return da.map(mda => { //if it is array then map each object in array. if(mda.length){ return mda.map(smda => { return Observable.of(smda); }) }else { return mda; } }) });

console.log(da) i.e. first map displays the type of data I am getting. I am checking length of each element in array and mapping it back.

What is that I am missing here?

Based on the image, you have an array of objects and array. You can flatten it using [].concat(...data). Use array#concat with spread syntax.

<pre class="snippet-code-js lang-js prettyprint-override">var data = [{id: "12321", itemName: "Item 1", category: "All"}, [{id: "423423", itemName: "Sub Item 1", category: "subcat"}, {id: "413212", itemName: "Sub Item 2", category: "subcat"}],{id: "65655", itemName: "Item 2", category: "All"}, {id:"87877", itemName: "Item 3", category: "All"}, [{id: "354345", itemName: "Sub Item 1", category: "subcat"}, {id: "123434", itemName: "Sub Item 2", category: "subcat"}, {id: "765767", itemName: "Sub Item 3", category: "subcat"}, {id: "854643",itemName: "Sub Item 4", category: "subcat"}]], result = [].concat(...data); console.log(result);