Navigation Ionic 4 Javascript

Ionic Framework
1

Hello,
I’am using Vanilla Javascript in Ionic4
I want to route from one page to other but I don’t know how to add second page “such as Login Page for example”
This is my HTML code:

<!DOCTYPE html>

<html>

<head>
    <link rel="stylesheet" type="text/css" href="css/index.css">
    <script src="https://unpkg.com/@ionic/core@latest/dist/ionic.js"></script>
    <link href="https://unpkg.com/@ionic/core@latest/css/ionic.bundle.css" rel="stylesheet">
    <title>Hello World</title>
</head>

<body>
    <ion-app>
        <ion-menu side="start" menu-id="first">
            <ion-header>
                <ion-toolbar color="primary">
                    <ion-title>Start Menu</ion-title>
                </ion-toolbar>
            </ion-header>
            <ion-content>
                <ion-list>
                    <ion-route url="/login" component="page-login">
                        <ion-item>Login Page</ion-item>
                    </ion-route>
                </ion-list>
            </ion-content>
        </ion-menu>

        <ion-header>
            <ion-toolbar>
                <ion-title>Menu - Basic</ion-title>
            </ion-toolbar>
        </ion-header>
        <ion-content padding>
            <ion-button expand="block" onclick="openFirst()">Open Start Menu</ion-button>
        </ion-content>
        <ion-content padding component="page-login">
            Welcome To Login Page
        </ion-content>
    </ion-app>

    <ion-menu-controller></ion-menu-controller>

    <ion-router>
        <ion-route url="/login" component="page-login"></ion-route>
    </ion-router>

    <!-- <script type="text/javascript" src="cordova.js"></script> -->
    <script type="text/javascript" src="js/index.js"></script>
</body>

</html>

This is my JS code:

const menuCtrl = document.querySelector('ion-menu-controller');
const navCtrl = document.querySelector('ion-router');

function openFirst() {
    menuCtrl.enable(true, 'first');
    menuCtrl.open('first');
}

function login() {
    navCtrl.push("/login");
}

Thanks a lot

2

Hello RiyadKhalifeh … did you ever found a solution for this? Thanks for sharing!