Angular создает полосу прокрутки при нажатии на ссылку <a>, но не должно?

Question

Я создал боковую панель навигации с mat-nav-list и тегами link / anchor в NavigationComponent. Существует 3 навигационных ссылки: Дом, Контакт, Другое. RouteLink есть только у Home (остальные только href = "#"), и каждый раз, когда я нажимаю в Home, сайт работает так, как будто загружается столько контента, что приходится вносить изменения в высоту, но загрузка контента не происходит (что хорошо), но все равно появляется полоса прокрутки для 1 se c, а затем исчезает. Если я достаточно быстро нажму одну из этих кнопок, полоса прокрутки будет становиться все меньше и меньше, а через 1 сек c исчезнет. Знаете ли вы, что вызывает эту ошибку?

Редактировать: Код:

AppComponent (root):

<app-header class="center_component header"></app-header>
<app-navigation-menu></app-navigation-menu>
<div class="home_content">
    <router-outlet></router-outlet>
</div>
<app-footer class="center_component"></app-footer>

Меню навигации:

<mat-nav-list>
      <a mat-list-item [routerLink]="['/home']" 
            class="btn btn-primary btn-lg"> Home </a>
      <a mat-list-item href="#" 
            class="btn btn-primary btn-lg"> Projects </a>
      <a mat-list-item href="#" 
            class="btn btn-primary btn-lg"> Contact </a>
</mat-nav-list>

app-routing.module. ts:

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { HomeContentComponent } from './home-content/home-content.component';


const routes: Routes = [
  { path: 'home', component: HomeContentComponent }/*,
  { path: '', redirectTo: '/home', pathMatch: 'full'}*/
];

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