Question

我在我的angular2应用程序中使用了引导箱警报，以在UI上向用户显示信息。我在警报消息中显示href链接。当用户单击任何href链接时，应将页面导航到该链接，并且启动框警报模式也应关闭。

在我的代码中，页面导航到href链接。但是，模态尚未关闭。我怎样才能做到这一点？下面是我的代码：

bootbox.alert({
      title: "Select option for profile #"+this.profileId,
      message:
      "<a href=\"#/profile-details/"+this.profileId+"\">View/Update</a><br>" +
      "<a href=\"#/status-update/"+this.profileId+"/"+this.status+"\">Deactivate/Reactivate</a><br>"+
      "<a href=\"#/adhoc-request/"+this.profileId+"/"+this.status+"\">Ad Hoc Request</a><br>"+
      "<a href=\"#/internal-resend/"+this.profileId+"\">Internal Download</a><br>"+
      "<a href=\"#/audit-tracking/"+this.profileId+"\">Audit Tracking</a><br>"
    });

任何输入表示赞赏！

Answer 1

您可以捕获所创建的模态对象（请参见https://jsfiddle.net/q1Lm385a/1/）：

var $mymodal = bootbox.alert({
  title: "Select option for profile #"+this.profileId,
  message:
  "<a href=\"#/profile-details/"+this.profileId+"\">View/Update</a><br>" +
  "<a href=\"#/status-update/"+this.profileId+"/"+this.status+"\">Deactivate/Reactivate</a><br>"+
  "<a href=\"#/adhoc-request/"+this.profileId+"/"+this.status+"\">Ad Hoc Request</a><br>"+
  "<a href=\"#/internal-resend/"+this.profileId+"\">Internal Download</a><br>"+
  "<a href=\"#/audit-tracking/"+this.profileId+"\">Audit Tracking</a><br>"
});

这将使手动关闭模态相对容易：

$mymodal.on('click', '.bootbox-body a', function(e){
    $mymodal.modal('hide');
});

Bootbox还有一个global function，您可以致电：

$mymodal.on('click', '.bootbox-body a', function(e){
    bootbox.hideAll();
});

Answer 2

尝试将data-dismiss="modal"添加到标签中。 Source

此外，研究routerLink也许是个好主意？

<a routerLink='[profile-details, this.profileId]' data-dismiss="modal">View/Update</a>

here

是路由的一个很好的起点

在href链接上关闭启动箱警报，请点击

2 个答案: