Routing with key from Firebase with Ionic and Angular

Question

I have some issue with routerLink when I'm trying to update my note. The console still show that it can get the key but it cannot route.

Here is the error:

Here is my code:

    <ion-header [translucent]="true">
  <ion-toolbar>
    <ion-title>
      Note
    </ion-title>
  </ion-toolbar>
</ion-header>
<ion-content>
  <ion-header collapse="condense">
    <ion-toolbar>
      <ion-title class="ion-text-center" size="large">My Note</ion-title>
    </ion-toolbar>
  </ion-header>
  <ion-list class="ios list-ios hydrated">

    <ion-item *ngFor="let booking of Bookings"  class="user-list">
      <ion-label>
        <h5 class="color">
          <ion-icon name="checkmark"></ion-icon> {{booking.title}}
        </h5>
        <p>
          <ion-icon name="attach"></ion-icon> {{booking.note}}
        </p>
      </ion-label>
      <div class="item-note" item-end>
        <button ion-button clear [routerLink]="['edit-note', booking.$key]">
          <ion-icon name="create" style="zoom:2.0"></ion-icon>
        </button>
        <button ion-button clear (click)="deleteBooking(booking.$key)">
          <ion-icon name="trash" style="zoom:2.0"></ion-icon>
        </button>
      </div>
    </ion-item>
  </ion-list>
  <ion-fab vertical="bottom" horizontal="end" slot="fixed">
    <ion-fab-button [routerLink]="['make-note']">
      <ion-icon name="add"></ion-icon>
    </ion-fab-button>
  </ion-fab>
</ion-content>

My routing.module.ts

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { Tab4Page } from './tab4.page';

const routes: Routes = [
  {
    path: '',
    component: Tab4Page
  },
  {
    path: 'make-note',
    loadChildren: () => import('src/app/make-note/make-note.module').then(m => 
m.MakeNotePageModule)
  },
  {
    path: 'edit-note',
    loadChildren: () => import('src/app/edit-note/edit-note.module').then(m => 
m.EditNotePageModule)
  }
];
@NgModule({
  imports: [RouterModule.forChild(routes)],
  exports: [RouterModule],
})
export class Tab4PageRoutingModule {}

It still get the key from the firebase but it cannot route to the update page. Can you guys help me with that? I'm new with Firebase and Ionic and I need to fix this error for my final project.