Angular 11 - Routing is not working properly with parameter

I have a simple application in which when I use parameter with routing direct after localhost path working fine, but when I click on different routing 'test2' it is able to change the path(http://localhost:4200/test2) but page is not redirecting to that routing, it remains in same page(home page) in my project. I am not able to debug actually what is happening. sample code below

app-routing.module.ts

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

const routes: Routes = [
  {
    path: "",
    pathMatch: 'full',   
    component: TestComponent
  },
  {
    path: ":id",
    component: TestComponent
  },
  {
    path: "test2",   
    component: Test2Component
  },
 
];

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