RouterLink не переходит к модулям отложенной загрузки

У меня проблема с переходом к компоненту, определенному в модуле отложенной загрузки. Компонент ListComponent определен по пути «test» (my-routing.module.ts — модуль отложенной загрузки). Всякий раз, когда я нажимаю кнопку «Тест» (test.comComponent.html), я получаю исключение:

NG04002: Невозможно сопоставить ни один маршрут. Сегмент URL: «тест».

Почему?

Мое приложение-routing.module.ts выглядит так:

import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { HomeComponent } from './components/home/home.component';
import { AboutComponent } from './components/about/about.component';
import { DashboardComponent } from './components/dashboard/dashboard.component';
import { AuthGuard } from './auth.gard';
import { ListComponent } from './list.component';
import { TestComponent } from './test/test.component';


const myModule = () => import('./my-routing/my-.module').then(x => x.MyRoutingModule);
const routes: Routes = [
  { path: '', component: TestComponent },
  { path: 'experiment', loadChildren: myModule },

];

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

Мой my-routing.module.ts:

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { ListComponent } from '../list.component';
import { TestComponent } from '../test/test.component';

const routes: Routes = [

  { path: 'test', component: ListComponent },

];

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

Мой test.comComponent.html выглядит так:

<div class = "container">
  <div class = "row">
    
    <div class = "col-1">
      <a [routerLink] = "['test']"><button type = "button" class = "btn btn-primary">
          Test</button></a>
    </div>

  </div>
</div>