How do I push pages onto "ion-nav" in Angular?

Ionic Framework Ionic Angular
1

I want to use an ion-nav element to imitate a UINavigationController in iOS. The example found here only provides an example in Javascript and not in Angular. I don’t know how to programmatically push pages onto the ion-nav element on my page. I’ve tried using ViewChild to access the ion-nav on my HTML page. Is this the correct way I should do it?

home.page.html

<ion-nav #nav [root]="rootPage">
  <ion-header>
    <ion-toolbar>
      <ion-title>
           App
      </ion-title>
    </ion-toolbar>
  </ion-header>

  <ion-content>
    <div class="ion-padding">
    <ion-button (click)="go()" expand="block">Start</ion-button>
  </ion-content>
</ion-nav>

home.page.ts

import { Component, ElementRef, ViewChild } from '@angular/core';
import { Router } from '@angular/router';
import { NavController } from '@ionic/angular/dist/providers/nav-controller';
import { InspectionMenuPage } from 'src/app/inspection-menu/inspection-menu.page';
import { IonNav } from '@ionic/angular';

@Component({
  selector: 'app-home',
  templateUrl: 'home.page.html',
  styleUrls: ['home.page.scss'],
})
export class HomePage {

  @ViewChild('nav', {static: false}) nav: IonNav;

  constructor() {
    
  }
  
  ngOnInit(){

  }

  go(){
    this.nav.push(InspectionMenuPage);
  }

}