Firstful i generate a dynamic menu for split pane, when i resize my page, the ion menu button displayed, for now is good, but when i click the menu button, the menu show duplicated items, so how i can handle this problem please help me !!
Can you post the relevant code?
Menu
<ion-split-pane contentId="menu-content">
<!-- our side menu -->
<ion-menu side="start" contentId="menu-content" menuId="first">
<ion-header>
<ion-toolbar translucent>
<ion-title>I-Check</ion-title>
</ion-toolbar>
</ion-header>
<ion-content>
<div *ngFor="let p of pages">
<ion-menu-toggle menu="first" *ngIf="p.url">
<!-- <ion-menu-button color="light"></ion-menu-button> -->
<ion-item [routerLink]="p.url" routerDirection="root" routerLinkActive="active">
<ion-label>{{ p.title }}</ion-label>
</ion-item>
</ion-menu-toggle>
<ion-item button *ngIf="p.url; else childrenItem" [routerLink]="[{ outlets: { admin: [p.url] } }]"
[class.active-parent]="p.open" detail="false">
<ion-icon [src]="p.icon" slot="start"></ion-icon>
<ion-icon slot="end" name="arrow-dropright" *ngIf="p.children?.length > 0 && !p.open"></ion-icon>
<ion-icon slot="end" name="arrow-dropdown" *ngIf="p.children?.length > 0 && p.open"></ion-icon>
<ion-label>{{ p.title }}</ion-label>
</ion-item>
<ion-list *ngIf="p.open" lines="none">
<!-- <ion-menu-toggle> [routerLink]="['/admin',{ outlets: { admin: [sub.url] } }]" -->
<ion-item button class="sub-item" *ngFor="let sub of p.children" (click)="navigateTo(sub.url)"
routerDirection="root" routerLinkActive="active">
<ion-label>{{ sub.title }}</ion-label>
</ion-item>
<!-- </ion-menu-toggle> -->
</ion-list>
<ng-template #childrenItem>
<ion-item button (click)="p.open = !p.open" [class.active-parent]="p.open" detail="false">
<ion-icon [src]="p.icon" slot="start"></ion-icon>
<ion-icon slot="end" name="arrow-dropright" *ngIf="p.children?.length > 0 && !p.open"></ion-icon>
<ion-icon slot="end" name="arrow-dropdown" *ngIf="p.open"></ion-icon>
<ion-label>{{ p.title }}</ion-label>
</ion-item>
</ng-template>
</div>
</ion-content>
</ion-menu>
<ion-router-outlet id="menu-content" name="admin"></ion-router-outlet>
</ion-split-pane>
Example Page with ion-menu-button
<ion-header>
<ion-toolbar>
<ion-title>Conducteur</ion-title>
<ion-buttons slot="start" menuId="first">
<ion-menu-button></ion-menu-button>
</ion-buttons>
</ion-toolbar>
</ion-header>
<ion-content>
</ion-content>