[Dúvida] [Projeto Solo] - Roteamento

Olá,

Estou com uma duvida besta sobre o roteamento que por algum motivo não está funcionando. Estou fazendo meu projetinho em Angular 17 e criei meu roteamento, todavia quando eu clico no botão de roteamento, ele não redireciona, eu olhei a doc a forma de execução parece igual, alguém poderia dar uma luz?

Este é meu componente chamado cabecalho-privado

<nav style="background-color: #1e1b4b; 
            padding: 10px; 
            height:90px; 
            margin-bottom: 70px;
            border-bottom: 10px solid #5340c6;
            border-radius: 0px 0px 15px 15px;
            display: flex; 
                justify-content: space-between;
            align-items: center;">
    <a style="margin-left: 20px; color: white">Mural FIAP</a>
    <ul style="align-items: center; display: flex; justify-content: space-between; list-style-type: none; padding: 0px; margin: 0px;">
        <li style="margin-right: 20px;"><a routerLink="inicio"style="color: white" >Home</a></li>
        <li style="margin-right: 20px;"><a routerLink="novoPost" style="color: white" >Novo Post</a></li>
        <li style="margin-right: 20px;"><a routerLink="login" style="color: white" >Sair</a></li>
    </ul>
</nav>

este é meu app.routes.ts

import { Routes } from '@angular/router';
import { ListagemPostsComponent } from './componentes/listagem-posts/listagem-posts.component';
import { NovoPostComponent } from './componentes/novo-post/novo-post.component';
import { LoginComponent } from './componentes/login/login.component';

export const routes: Routes = [
    {path: 'inicio',  component: ListagemPostsComponent},
    {path: 'novoPost', component: NovoPostComponent},
    {path: 'login', component: LoginComponent},
    {path: '', pathMatch: 'full', redirectTo: 'inicio', },
];

este é meu app.component.html

<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css" rel="stylesheet" crossorigin="anonymous" integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65">
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>


<div class="container">
    <router-outlet></router-outlet>
</div>

e este é o app.component.ts

import { Component } from '@angular/core';
import { CommonModule } from '@angular/common';
import { RouterOutlet } from '@angular/router';

@Component({
  selector: 'app-root',
  standalone: true,
  imports: [CommonModule, RouterOutlet],
  templateUrl: './app.component.html',
  styleUrl: './app.component.css'
})
export class AppComponent {
  title = 'MuralFIAP';
  
}

Chega a ser exibido o texto, porém quando clica no texto ele não redireciona para os componentes.