Lo que quiero lograr es hacer clic y hacer un desplazamiento suave al área div inferior / especificada que defino con el hashtag tal como creo que debería ser así.

Aquí está el ejemplo en vivo en el ejemplo de w3school que está escrito para JQuery:https://www.w3schools.com/jquery/tryit.asp?filename=tryjquery_eff_animate_smoothscroll

Lo que hago es echar un vistazo a esta respuesta:Enrutamiento Angular2 con Hashtag para anclaje de página

pero realmente no entiendo la respuesta, la respuesta se ve así:

esta parte es parte HTML:

<a [routerLink]="['somepath']" fragment="Test">Jump to 'Test' anchor </a>

y debajo de esto, el router.navigate es ¿dónde debo poner el código? componente.ts ¿verdad? pero ¿cómo accedo a esta función? ¿Debo implementar (clic)?

this._router.navigate( ['/somepath', id ], {fragment: 'test'});

y debajo de esto, lo entiendo, que debería escribir en mi component.ts:

** Add Below code to your component to scroll**

  import {ActivatedRoute} from '@angular/router'; // <-- do not forget to import

  private fragment: string;

  constructor(private route: ActivatedRoute { }

  ngOnInit() {
    this.route.fragment.subscribe(fragment => { this.fragment = fragment; });
  }

  ngAfterViewInit(): void {
    try {
      document.querySelector('#' + this.fragment).scrollIntoView();
    } catch (e) { }
  }

¿Qué significa el "somepath"? Debo agregar una ruta en mi route.ts ¿verdad? por lo general, agrego una nueva ruta aquí, por ejemplo, así:

export const routes: Routes = [
  { path: '', redirectTo: '/home', pathMatch: 'full' },
  { path: 'product', redirectTo: '/product' },
  ...homeRoutes,
  ...productRoutes
];

¿Alguien puede proporcionarme un código de ejemplo completo en HTML, rutas y componentes?