Hello there! I am a newcomer to TypeScript and Ionic. I am trying to implement a function that clears the cart when the "Mercado" option in the side menu is clicked, but I am struggling to retrieve the page data. The code snippet below shows my attempt to access the data, but it has not been successful.
app.component.html
<ion-menu side="end">
<ion-header>
<ion-toolbar>
<ion-title>Menu</ion-title>
</ion-toolbar>
</ion-header>
<ion-content>
<ion-list >
<ion-menu-toggle auto-hide="false" *ngFor="let p of appPages; let i = index" >
<ion-item [routerDirection]="'root'" [routerLink]="[p.url]" (click)= "apagarCarrinho(p)">
<ion-icon slot="start" [name]="p.icon"></ion-icon>
<ion-label>
{{p.title}}
</ion-label>
</ion-item>
</ion-menu-toggle>
</ion-list>
</ion-content>
</ion-menu>
<ion-router-outlet main></ion-router-outlet>
app.component.ts
import { CarrinhoService } from './carrinho.service';
import { ProdutosService } from './produtos.service';
import { LoginService } from './login.service';
import { Component } from '@angular/core';
import { Platform, NavController, ToastController, AlertController } from '@ionic/angular';
import { SplashScreen } from '@ionic-native/splash-screen/ngx';
import { StatusBar } from '@ionic-native/status-bar/ngx';
@Component({
selector: 'app-root',
templateUrl: 'app.component.html'
})
export class AppComponent {
view:any;
public appPages = [
{
title:'Mercado',
url: '/menu',
icon:'basket',
component: 'mercadoPage'
},
{
title:'Log Out',
url: '/logout',
icon: 'close-circle-outline',
component: 'logoutPage'
},
];
public idMercado
public pageClicada
constructor(
private platform: Platform,
private splashScreen: SplashScreen,
private statusBar: StatusBar,
private navCtrl: NavController,
private LoginService: LoginService,
private toastCtrl: ToastController,
public alertCtrl: AlertController,
public ProdutosService: ProdutosService,
public CarrinhoService: CarrinhoService
) {
this.initializeApp();
this.platform = platform;
}
initializeApp() {
this.platform.ready().then(() => {
this.statusBar.styleDefault();
this.splashScreen.hide();
});
}
async apagarCarrinho(page){
this.pageClicada = page
console.log(this.pageClicada)
}
}