Angular2 ng-bootstrap 模态关闭组件

标签 angular modal-dialog ng-bootstrap

当输入正常时,我将通过保存关闭组件中的引导模式。 我正在使用 Angular v2.4.1 和 ng-bootstrap 1.0.0-alpha.19

我试过了 this解决方案,但出现以下错误:

No provider for ViewContainerRef

我尝试将 ViewContainerRef 添加到我的 module.ts,但出现以下错误:

Type 'typeof ViewContainerRef' is not assignable to type 'Provider'

这里是我的组件中的代码:

import { Component } from '@angular/core';
import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';

@Component({
    selector: '[add-name]',
    templateUrl: '../add-name.html'
})

export class MyComponent {   
   public errorMessage: string = '';

   constructor(public modalActive: NgbActiveModal) {}

   public saveNewStuff(name: string) {
        this.errorMessage = '';

        if (name === '' || name === undefined) {
            this.errorMessage = 'some message';
        } else if (this.errorMessage === '') {
            this.modalActive.close();
        }
    }
}

我也尝试使用 NgbModalRef喜欢

  constructor(public modalRef: NgbModalRef) {}

 public closeModal() {
    this.modalRef.close();
    this.modalRef.dismiss();
}

但这根本不起作用。我什至没有收到错误消息。

最佳答案

您必须保存对 openend 模态窗口的引用以便稍后关闭它,例如:

public mr: NgbModalRef;
...
public openModal(content: string) {
    this.mr = this.modalService.open(content);
}
...
public closeModal() {
   this.mr.close();
}

关于Angular2 ng-bootstrap 模态关闭组件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42069118/

相关文章:

javascript - Angular SEO,如何正确设置?

javascript - 在页面 ionic 2 中使用 app.component 函数

oracle - 谷歌标签管理器和甲骨文 APEX : Track close dialog

Angular 6 ng-bootstrap 评级不起作用

angular - ng-bootstrap Modal 将附加类传递给 .modal-dialog

css - 启动时 Angular Material Dialog 组件滚动问题

angular - npm 在多个环境上运行构建,没有提及指定的环境

html - 在单个页面中处理多个 NgbPagination

javascript - Angular JS 应用程序设备后退按钮必须有确认对话框

javascript - 根据路线决定渲染到哪个导出