繁体   English   中英

在执行下一个函数之前,如何等待Angular bootstrap模态窗口的响应?

[英]How do I wait for response from an Angular bootstrap modal window before executing next function?

我正在尝试为用户创建一个验证窗口,以便在将数据提交到数据库之前验证其输入。

引导模式窗口可以工作,但是如果我将func x()放在(click)=按钮上,x()会在显示模态时执行。

另一个困难是我试图将模态窗口用于三个潜在的数据库更新请求(删除,发布或放置),因此x()需要是动态的,具体取决于打开模态窗口的按钮。

引导模式窗口可以工作,但是如果我将func x()放在(click)=按钮上,x()会在显示模态时执行。

另一个困难是我试图将模态窗口用于三个潜在的数据库更新请求(删除,发布或放置),因此x()需要是动态的,具体取决于打开模态窗口的按钮。

HTML

<span *ngIf="!isCurrent">
                                    <button class="entry" id="add" (click)="openProofWindow(proof, 'add');">Add</button>&nbsp;&nbsp;
                                </span>
                                <span *ngIf="isCurrent">
                                    <button class="entry" id="update" (click)="openProofWindow(proof, 'update');">Update</button>&nbsp;&nbsp; <!--updateRequest();-->
                                    <button class="entry" id="delete" (click)="openProofWindow(proof, 'delete');">Delete</button>&nbsp;&nbsp;
                                </span>

ts代码

 openProofWindow(content, target): void {
 this.modalService.open(content, target);

我努力了:

(click)="openProofWindow(proof, 'add');addRecord();"

但这会在模态关闭之前执行。

这是模态窗口(HTML)

<div class="modal-header container">
        <div class="row">
            <h4 class="modal-title col-7">Proof Copy</h4>
            <button type="button" class="btn col-2 btn-modal" aria-label="no" (click)="modal.dismiss('cancel click')">
                    <span aria-hidden="true">No</span>
                </button>
            <button type="button" class="btn col-2 btn-modal btn-success" aria-label="ok" ngbAutofocus (click)="modal.close('Ok click');">
                <span aria-hidden="true">Ok</span>
            </button>
        </div>
    </div>

在用户选择“确定”或“否”之前,不会发生任

如果用户选择OK,则根据模式是作为添加,删除还是更新(放置,删除,发布)请求打开,应调用相应的函数 - 并关闭模态窗口。

你可以用它

this.modalService.afterClosed().subscribe(result => {
  console.log('The dialog was closed');
  this.animal = result;
});

我也想在这里参考材料文档

我确实找到了答案:

在:

openProofWindow(content, target): void {
 this.modalService.open(content, target);

我没有为modalService.open添加一个参数,而是设置了一个公共变量。

public updateType: string;

openProofWindow(content, target): void {
this.updateType = target;
 this.modalService.open(content);

然后,在“确定”按钮中,我拨打一个额外的电话:

<button type="button" class="btn col-2 btn-modal btn-success" aria-label="ok" ngbAutofocus (click)="confirmedEdit(); modal.close('Ok click');">
                <span aria-hidden="true">Ok</span>

我需要添加函数来引用变量集:

confirmedEdit(): void {
  console.log(this.updateType);
}

这有效。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM