Ionic nested looping JSON Array

I need a help in this code.


private initializeOptions(): void {
    for (var i = 0; i < this.sidemenus.length; ++i) {
      this.options.push({
        displayName: this.sidemenus[i].category,
        subItems: [{
            displayNamesub: 'Watch Store',
            component: MainshopPage
          }]
      });
    }
  }

in this code, I want to set the


 subItems: [{
                displayNamesub: 'Watch Store',
                component: MainshopPage
              }]

on the loop. actually, i want to loop the displayNamesub value.

tried this:

private initializeOptions(): void {
        for (var i = 0; i < this.sidemenus.length; ++i) {
          this.options.push({
            displayName: this.sidemenus[i].category,
for (var j = 0; i <this.sidemenus[i].subs.length;++j) {
            subItems: [{
            displayName: this.sidemenus[i].subs[j].subcategory,
                component: MainshopPage
              }]
}
          });
        }
      }

but it didn’t work. I need help to loop the subItems

JSON:


[
  {
    "category":"Accessories & Moments",
    "subs": [
      {
        "subcategory":"'Watch Store"
      },
      {
        "subcategory":"Premium Fragments"
      },
      {
        "subcategory":"Confectioneries"
      }
    ]
  }
...............................................
]

I take data from the JSON please help.

Hi, @Faizyfaazz

try like below Code :

let myArray:any = [{displayName: '',subItems: []}]


for (var i = 0; i < this.sidemenus.length; ++i) {
      myArray.displayName = this.sidemenus[i].category
      for (var j = 0; j < this.sidemenus[i].subs.length; ++j) {
         myArray.subItems[j].push({
            displayName : this.sidemenus[i].subs[j].subcategory,
            component : 'MainshopPage'
         })
      }
}

console.log('myArray',myArray);

this.options = myArray;

thanks

@addwebsolution THIS CODE IS NOT WORKING
IT SHOWS SOME ERROR

erro

Hi, @Faizyfaazz
try below code:


sidemenus =[
    {
        "category":"Accessories & Moments",
        "subs":[
            {
                "subcategory":"'Watch Store"
            },
            {
                "subcategory":"Premium Fragments"
            },
            {
                "subcategory":"Confectioneries"
            }
        ]
    },
    {
        "category":"Kids Club",
        "subs":[
            {
                "subcategory":"Watch Store"
            },
            {
                "subcategory":"Confectioneries"
            }
        ]
    },
    {
        "category":"Women's Choice",
        "subs":[
            {
                "subcategory":"Watch Store"
            },
            {
                "subcategory":"Confectioneries"
            }
        ]
    },
    {
        "category":"Wanderlust",
        "subs":[
            {
                "subcategory":"Watch Store"
            },
            {
                "subcategory":"Confectioneries"
            }
        ]
    },
    {
        "category":"Spa and Saloon",
        "subs":[
            {
                "subcategory":"Confectioneries"
            },
            {
                "subcategory":"Watch Store "
            }
        ]
    }
];
options:any=[];
myArray:any=[];

 for(let i =0; i < this.sidemenus.length; ++i) {
             this.myArray.push({'displayName': this.sidemenus[i].category,"subItems":[]});
             for (let j=0; j < this.sidemenus[i].subs.length; ++j) {
                this.myArray[i].subItems.push({'displayName': this.sidemenus[i].subs[j].subcategory,'component': 'MainshopPage'});
             }
       }

       console.log('myArray',this.myArray);
       alert(JSON.stringify(this.myArray))
       this.options = this.myArray;

thanks

1 Like

@Faizyfaazz U can try nested looping like this

for(let items of this.myArray){  
      for (let opt of items.subs) {
      }
}

thanks a lot, u saved my day. @addwebsolution

@addwebsolutionI solved the looping issue, but I have a problem,
I have some static menu, that didn’t work.
like this,

	this.options.push({
			iconName: 'home',
			displayName: 'Home',
			component: HomePage,
			// This option is already selected
			selected: true
		});

I tried this:

 this.myArray.push({
      displayName: 'Home',
      component: HomePage,
    });

but it shows error
erro

it seems like new thing please create the new thread.

how can I do this?how to create a new thread?

create new question for this
.

@addwebsolution
https://forum.ionicframework.com/t/ionic-sidemenu-issue/122788/2