CODEWITHSUNDEEP
angularmobileionic-frameworkweb-applicationsionic2
Reece W Griffith
Reece W Griffith

Reputation: 50

Setting a new homepage with Ionic Framework

I am using the ionic framework to build and app. By default, the home directory is set as the homepage, but I have started building and would now like to add a login page before this original homepage. Is there anyway I can set the new login page as the starting page to the app? Thank you.

Upvotes: 0

Views: 8835

Answers (3)

art-fan-vikram
art-fan-vikram

Reputation: 315

For login scenario you can use rootPage property,

during declaration, like

rootPage:any = Dashboard;//import { Dashboard } from '../pages/dashboard/dashboard'

or within a method, like

this.rootPage = Dashboard

Later once you get successfull response after login, you can set the rootPage for app using App object, like

import { App } from 'ionic/angular'
import { Dashboard } from '../pages/dashboard/dashboaard'


//inject in contructor
constructor(private app:App){}


//then in method where login success is received
login(){
 if(loginValid){
   this.app.getRootNav().setRoot(Dashboard);//in this way you will not have back button for new page
 }
}

Hope it helps. :)

Upvotes: 1

CharanRoot
CharanRoot

Reputation: 6325

use rootPage in the MyApp 

export class MyApp {
  rootPage:any = 'YourLoginPage';
}

Upvotes: 1

embarq
embarq

Reputation: 335

You can do that in your src/app/app.component.ts. E.g.

import { Component } from '@angular/core';
import { LoginPage } from '...';

// other imports

@Component({
  template: `<ion-nav [root]="rootPage"></ion-nav>`
})
export class MyApp {
  public rootPage: any;

  constructor(
    platform: Platform
  ) {
    platform.ready().then(() => {
      StatusBar.hide();
      Splashscreen.hide();
      this.rootPage = LoginPage;    // don't forget to import this page
    });
  }
}

Upvotes: 1

Related Questions