Angular 4路由器和模态对话框

发布时间：2020-12-17 07:29:04 所属栏目：安全来源：网络整理

导读：我有使用Angular路由器的Angular 4 SPA应用程序. 我想要使??用Bootstrap 4在新对话框中打开组件的超链接.我已经知道如何从函数中打开模态对话框. 但是如何使用超链接打开它？ a [routerLink]="['/login']"Login/a 我想留下我当前的组件,只是在它前面显示模态

我有使用Angular路由器的Angular 4 SPA应用程序.
我想要使??用Bootstrap 4在新对话框中打开组件的超链接.我已经知道如何从函数中打开模态对话框.

但是如何使用超链接打开它？

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

我想留下我当前的组件,只是在它前面显示模态对话框.

另一个问题 – 是否有可能以编程方式执行此操作？这样我就可以

this.router.navigate(['/login']);

并在当前组件上显示登录模式对话框？

有什么建议？

我最好的猜测是你可能想要订阅激活的路线并改变路线中的参数以触发模态.

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
            }
        });
    }
}

我相信你会有一个看起来像这样的链接：
< a [routerLink] =“['/ yourroute',{modal：'true'}]”>

可以在这里找到更好的例子：Route Blog

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!