Angular 4 router i modalne okno dialogowe

Question

Mam aplikację Angular 4 SPA za pomocą routera Angular. Chcę mieć hiperłącze, które otwiera komponent w nowym oknie dialogowym za pomocą Bootstrap 4. Już wiem, jak otworzyć okno dialogowe modalne z funkcji.

Ale jak otworzyć to za pomocą hiperłącza?

<a [routerLink]="['/login']">Login</a> 

Chcę zostawić bieżący komponent i po prostu pokazać okno modalne przed nim.

Kolejne pytanie - czy można to zrobić programowo? Tak, że mogęi okno dialogowe logowania jest wyświetlane nad bieżącym komponentem?

Wszelkie sugestie?

Answer 1

Moim zdaniem, możesz chcieć zasubskrybować aktywowaną trasę i zmienić parametry trasy, aby uruchomić modalny.

import { ActivatedRoute, Params } from '@angular/router'; 
import { Component, OnInit } from '@angular/core'; 

@Component({ 
    selector: 'cmp1', 
    templateUrl: './cmp1.component.html', 
    styleUrls: ['./cmp1.component.css'], 
}) 
export class Cmp1 implements OnInit { 

    constructor(private activatedRoute: ActivatedRoute) { 
    } 

    ngOnInit() { 
     this.activatedRoute.params.subscribe(params => { 
      if (params["modal"] == 'true') { 
       // Launch Modal here 
      } 
     }); 
    } 
} 

wierzę byś wtedy link, który wyglądał mniej więcej tak: <a [routerLink]="['/yourroute', {modal: 'true'}]">

lepszych przykładów można znaleźć tutaj: Route Blog