From buttons to a menu?


#1

I have a tabs page with some buttons on a toolbar, but recently with the addition of a new button I decided to, instead, migrate to using a sidemenu. So I added a menu to the template on app.component.ts, like so:

template: `
    <ion-menu #menu [content]="content" side="right" [enabled]="false">
        <ion-content>
            <button ion-item icon-left (click)="openGallery()">
                <ion-icon name="images"></ion-icon>
                {{ "gallery.gallery" | translate }}
            </button>
            <button ion-item icon-left (click)="newModal()">
                <ion-icon name="add"></ion-icon>
                {{ "new_record" | translate }}
            </button>
            <button ion-item icon-left (click)="about()">
                <ion-icon name="settings"></ion-icon>
                {{ "settings" | translate }}
            </button>
        </ion-content>
    </ion-menu>
    <ion-nav #content [root]="rootPage"></ion-nav>`

And then I added a ViewChild @ViewChild('content') content : Nav; so I could push pages with this.content.push; so far so good, but… On two of these buttons, I have to pass some parameters when pushing to the pages:

openGallery() {
        this.nav.push(GalleryPage, {
            record_to_show: 0,
            category_to_show: this.filterProvider.filters.categoryFilter
        });
    }

While record_to_show is simply the tab index, I can’t simply import the FilterProvider I have in the app.component.ts page as it causes some issues regarding when that provider is actually loaded. Is there a way to keep the functions in the tabs and then when the button on the menu is clicked, it runs the equivalent function, or some other solution?


#2

You need to fix those issues. That’s the best solution.