How to implement Dynamically created subcategories in existing dynamic side menu items

Ionic Framework ionic-v3
1

please help me any one i have done dynamic side menu but i want subcategories dynamically on existing menu…
please see below code in there any additional code will add let me know please…

this.newsService.getJsonData24().subscribe(
      data => {
        //alert("result: " + data.result);

        this.newsdata = data.result;
        console.log("success: " + this.newsdata);
        //Cannot read property 'children' of undefined
      },
2

HOW TO POST CODE

First we type three backticks at the beginning of a fresh line, then we put all of our code after them, with proper indentation, and we finish the code fence with another set of three backticks. Use the preview feature to make sure you are doing it right.

```
f(arg: string): void {
  if (string === ‘foo’) {
    this.barificate(arg);
  } else {
    this.fooificate(arg);
  }
}
```

…would become:

f(arg: string): void {
  if (arg === 'foo') {
    this.barificate(arg);
  } else {
    this.fooificate(arg);
  }
}

As for your question, I get that you are excited to make as much progress as you can as quickly as possible. However, it’s really not sustainable to expect a bunch of volunteers to completely write your app for you. If you can make some time, take a deep breath, and really go through the Tour of Heroes, and then clone the Ionic conference app, run it, explore all of its features with an eye on what might be similar to things you want to do in your app and look at how it is implemented.

It may seem like a waste of time to you now, but when you look back at it a week from now, you will be a much more self-sufficient programmer that will be making more efficient progress with a better understanding of what you are doing, and you’ll be able to make better use of the resources of the forum.

7 Likes
3

Hai rapropos, Thank you for your support,

getdata() {

    this.loading.present();

    this.newsService.getJsonData24().subscribe(
      data => {
        //alert("result: " + data.result);        
        this.newsdata = data.result; 
        this.subnews=data.subcategory;        
        console.log("success: " + this.newsdata);
        console.log("success: " + this.subnews);
        //Cannot read property 'children' of undefined
      },

`
…in app.html:

<button menuClose ion-item *ngFor=“let p of newsdata” [class.activeHighlight]=“checkActive§” (click)=“openPage§” class=“grids”>
{{p.category_name}}



<button menuClose ion-item *ngFor=“let p of subnews” [class.activeHighlight]=“checkActive§” (click)=“openPage§” class=“grids”>
{{p.category_name}}

out put of my app...show below 
<img src="//cdck-file-uploads-global.s3.dualstack.us-west-2.amazonaws.com/ionicframework/original/3X/2/5/2501f43b0da710edbf4abd482e788ff029ad87ef.jpg" width="349" height="355">
in AP and TELANGANA i have subcategories but here how to do... please help me...
4

Many people have suggested that you look at the ionic conference app. I fear you have not done this. In particular, please look at the app template, and its use of <ion-list-header>. Please, please, we are trying to help you, but in order to do this productively, you need to build up a base of fundamental understanding of the framework.

1 Like
5

yeah! i saw ionic conference app but that is not in get from remote server data to our app…that is like
this.pages=[
{…}
];

please check our json link http://roshannews.net/services/menu.php
i want data from here to our application…

6

in previously i have done that type in our application like below…

 <ion-list no-lines class="grids" style="margin-top: 36px;">
<ion-list-header>
AP
</ion-list-header>
 <button menuClose ion-item *ngFor="let p of subnews" [class.activeHighlight]="checkActive(p)" (click)="openPage(p)"  class="grids">
        {{p.category_name}}
      </button>      
    </ion-list>