How do I loop over a multidimensional array with ngFor in angular?

@Simbaclaw wrote:

suppose I have an object like this:

0: ["some string 1"]
1: Array(3)
    0: "some string 2"
    1: "some string 3"
    2: "some string 4"
    length: 3
    __proto__: Array(0)
2: ["some string 5"]
3: ["some string 6"]
4: ["some string 7"]

and the structure of it can change from one of the top level array indexes to a multidimensional array. So for example it could become:

0: ["some string 1"]
1: Array(3)
   0: "some string 2"
   1: "some string 3"
   2: "some string 4"
   length: 3
__proto__: Array(0)
2: Array(4)
   0: "some string 5"
   1: "some string 6"
   2: "some string 7"
   3: "some string 8"
   length: 4
3: ["some string 9"]
4: ["some string 10"]

how would I loop over this using ngfor so that everything becomes top level, I want to display from 1 counting up to the last string number.
currently when I use a single ngfor it’ll create a element for array number 1 with comma seperated values

the output needs to look like:

<p>some string 1</p>
<p>some string 2</p>
<p>some string 3</p>
etc

While when using ngfor on a p tag like so:

<p *ngFor="let object of stringsArray">{{object}}</p>

for the strings object in the first example of this post it does this:

<p>some string 1</p>
<p>some string 2,some string 3,some string 4</p>
<p>some string 5</p>

To get this to work all I would have to do is move the second dimension to the first dimension of the array.

ANSWER:
This can be achieved with a simple spread operator in ES6 to concatenate the multidimensional array into a single dimensional one like so:

arr1d = [].concat(...arr2d);

Posts: 3

Participants: 2

Read full topic