4
votes

Comment définir rootPage dans IONIC 4

C'est ce que j'ai maintenant et je n'arrive vraiment pas à trouver la bonne réponse à ma question. J'ai regardé partout, alors peut-être que quelqu'un qui sait peut m'aider ?. Comment définir RootPage comme dans Ionic 3 dans Ionic 4 parce que j'ai tout essayé et c'est ce qui reste à essayer

import {Component, ViewChild} from '@angular/core';
import {NavController, Platform} from '@ionic/angular';
import {SplashScreen} from '@ionic-native/splash-screen/ngx';
import {StatusBar} from '@ionic-native/status-bar/ngx';
import {Router} from '@angular/router';
import {GettingStartedPage} from './getting-started/getting-started.page';

@Component({
selector: 'app-root',
templateUrl: 'app.component.html',
})

export class AppComponent {
@ViewChild(NavController) nav: NavController;
rootPage;


constructor(
    private platform: Platform,
    private splashScreen: SplashScreen,
    private statusBar: StatusBar,
    private NavCtrl: NavController) {
    this.initializeApp();
}

// Eindigt constructor

initializeApp() {
    this.platform.ready().then(() => {
        this.splashScreen.hide();
        // set status bar naar onze app kleur
        this.statusBar.backgroundColorByHexString('#E84B56');
    });
}

openPage(page) {
    // Reset the content nav to have just this page
    // we wouldn't want the back button to show in this scenario
    this.rootPage.navigateRoot('/getting-started');

}
}

angular ionic-framework ionic4 webpage root

0 commentaires

3 Réponses :

1
votes

Depuis Ionic 4, vous utilisez le routage angulaire. Si vous souhaitez que / getting-started soit votre page racine, accédez à app-routing.module.ts et modifiez les itinéraires. Si vous n'avez pas activé, créez un itinéraire qui pointe vers votre page et redirigez celui avec chemin: '' vers / Getting-started .

app-routing.module.ts final pourrait être:

const routes: Routes = [
    {path: '', redirectTo: 'getting-startet', pathMatch: 'full'}, //Root Path redirect to your getting-started path
    {path: 'getting-started', loadChildren: './getting-started/getting-started.module#GettingStartedPageModule'}, // when hit the getting-startet path, load the page
];

@NgModule({
    imports: [RouterModule.forRoot(routes)],
    exports: [RouterModule]
})
export class AppRoutingModule {
}

0 commentaires

0
votes

J'espère que ce qui suit vous aidera:

constructor(private nav: NavController){}

private setRoot(){
  this.nav.navigateRoot('/getting-started');
}

0 commentaires

0
votes

Ionic 4 utilise des routes pour naviguer. Vous pouvez trouver la configuration des routes dans /src/app/app-routing.module.ts , même si vous pouvez toujours la configurer dans votre fichier app.module.ts . Citant la documentation Ionic 4: , la configuration la plus basique semble un peu comme ceci:

import { RouterModule } from '@angular/router';

@NgModule({
  imports: [
  ...
  RouterModule.forRoot([
    { path: '', component: LoginComponent },
    { path: 'detail', component: DetailComponent },
  ])
  ],
})

La ventilation la plus simple de ce que nous avons ici est une recherche de chemin / composant. Lorsque notre application se charge, le routeur lance les choses en lisant l'URL que l'utilisateur tente de charger. Dans notre exemple, notre route recherche «», qui est essentiellement notre route d'index. Donc, pour cela, nous chargeons le LoginComponent. Assez simple.

Si vous souhaitez charger un composant différent lors du chargement initial, vous devez utiliser redirections

0 commentaires