Как настроить routerLink из компонента

Question

Ниже маршрутизация работает отлично, но я хотел обрабатывать ту же функциональность из компонента вместо HTML.

Как мне это сделать?

HTML

<a [routerLink]="[ '..', card.item ]">VIEW MORE</a>

Answer 1

попробуйте это для относительной навигации:

constructor(private route: ActivatedRoute, private router: Router) {}

moveTo() {
  this.router.navigate(['..', card.item], { relativeTo: this.route });
}

и добавьте свой метод клика в html

<a (click)="moveTo()">VIEW MORE</a>

Answer 2

Вы можете создать общий сервис для навигации:

import {Injectable} from '@angular/core';
import {Router} from '@angular/router';

@Injectable()
export class NavigationService {
  constructor(private router: Router) {
  }

  public goToProduct(productId: number): void {
    this.router.navigate(['..', productId]);
  }
}

Answer 3

Вы можете использовать Router

    import { Router } from '@angular/router';
    constructor(
        private router: Router,
    ) {}

   navigateTo(card){
       this.router.navigate([ '..', card.item ]);
   }