ionic start mySideMenu sidemenu --v2
After creating a sidemenu using the code above, I implemented some login-logout functionality by storing user details in a localStorage variable named "userDetails". When clicking on the logout option from the sidemenu, it redirects to the login page.
import { homePage } from '../pages/home/home';
import { DetailsPage } from '../pages/Details/Details';
import { AddclientPage } from '../pages/Addclient/Addclient';
import { Storage } from '@ionic/storage';
import { LoginPage } from '../pages/login/login';
@Component({
templateUrl: 'app.html'
})
export class MyApp {
@ViewChild(Nav) nav: Nav;
rootPage: any = homePage;
pages: Array<{title: string, component: any,icon:string}>;
constructor(platform: Platform,public storage:Storage,public mqttservice:Mqttservice) {
platform.ready().then(() => {
// Okay, so the platform is ready and our plugins are available.
// Here you can do any higher level native things you might need.
StatusBar.styleDefault();
Splashscreen.hide();
});
this.pages = [
{ title: 'Home ', component: homePage ,icon:"home"},
{ title:'Addclient',component:AddclientPage,icon:'add'},
{title: 'Users' ,component:DetailsPage,icon:"people"},
{ title:'addclient',component:AddclientPage,icon:"person-add"},
{title:'Logout',component:LoginPage,icon:"log-out"}
];
}
}
However, I want to remove the localStorage variable and then redirect to the login page when the user clicks on logout. So, I created a method that removes the "userDetails" variable and redirects to the "loginpage", but I am encountering an error stating that "can not read property 'setRoot' of undefined".
import { homePage } from '../pages/home/home';
import { DetailsPage } from '../pages/Details/Details';
import { AddclientPage } from '../pages/Addclient/Addclient';
import { Storage } from '@ionic/storage';
import { LoginPage } from '../pages/login/login';
@Component({
templateUrl: 'app.html'
})
export class MyApp {
@ViewChild(Nav) nav: Nav;
rootPage: any = homePage;
pages: Array<{title: string, component: any,icon:string}>;
constructor(platform: Platform,public storage:Storage,public mqttservice:Mqttservice) {
platform.ready().then(() => {
// Okay, so the platform is ready and our plugins are available.
// Here you can do any higher level native things you might need.
StatusBar.styleDefault();
Splashscreen.hide();
});
this.pages = [
{ title: 'Home ', component: homePage ,icon:"home"},
{ title:'Addclient',component:AddclientPage,icon:'add'},
{title: 'Users' ,component:DetailsPage,icon:"people"},
{ title:'addclient',component:AddclientPage,icon:"person-add"},
{title:'Logout',component:this.logout(),icon:"log-out"}
];
}
logout(){
this.storage.remove('userDetails);
this.nav.setRoot(LoginPage);
}
}