¿Cómo cerrar programáticamente ng-bootstrap modal?

Después de investigar en varios repositorios y páginas webs de internet finalmente descubrimos la respuesta que te compartiremos más adelante.

Solución:

Para exponer la respuesta de pkozlowski.opensource, la forma en que realmente obtuve la referencia a la clase NgbModalRef fue modificando lo que está en su plunker en this.modalService.open de la siguiente manera:

this.modalReference = this.modalService.open(content);
this.modalReference.result.then((result) => 
  this.closeResult = `Closed with: $result`;
, (reason) => 
  this.closeResult = `Dismissed $this.getDismissReason(reason)`;
);

Entonces pude llamar:

this.modalReference.close();

Lo cual funcionó a las mil maravillas. Ah, y no olvides poner define modalReference en la parte superior de la clase:

modalReference: any;

Si está utilizando https://ng-bootstrap.github.io/ (como se indica en su pregunta), las cosas son extremadamente simples: puede abrir un modal y cerrarlo desde una plantilla (como en su código) o programáticamente (llamando close() método en el objeto devuelto de tipo NgbModalRef).

Aquí hay un ejemplo mínimo que muestra esto en acción: http://plnkr.co/edit/r7watmQuyaUQ8onY17Z1?p=preview

Es posible que esté confundiendo diferentes bibliotecas o tal vez haya algo más en su pregunta, pero es difícil decir más basándose solo en la información proporcionada.

A diferencia de TBrenner, no podía simplemente usar modalReference: any;


corro con:

    "@ng-bootstrap/ng-bootstrap": "^1.0.0-beta.9",
    with angular 5

Tuve que importar en mi app.module.ts

import  NgbModal  from '@ng-bootstrap/ng-bootstrap';

y por supuesto agregarlo a los proveedores:

providers[ NgbModal]

una vez hecho, aquí está el código del componente modal:

 import  Component, Input  from '@angular/core'; 
 import  ModalDismissReasons, NgbModal, NgbModalRef  from '@ng 
 bootstrap/ng-bootstrap';

export class MyClass {
modalReference: NgbModalRef;

constructor(private modalService: NgbModal)
open(content) 
this.modalReference = this.modalService.open(content);
this.modalReference.result.then((result) => 
  this.closeResult = `Closed with: $result`;
, (reason) => 
  this.closeResult = `Dismissed $this.getDismissReason(reason)`;
);


private getDismissReason(reason: any): string 
if (reason === ModalDismissReasons.ESC) 
  return 'by pressing ESC';
 else if (reason === ModalDismissReasons.BACKDROP_CLICK) 
  return 'by clicking on a backdrop';
 else 
  return `with: $reason`;



JoinAndClose() 
this.modalReference.close();

https://ng-bootstrap.github.io debería agregar información sobre la importancia de la referencia. Me costó un poco entender que necesitaba crear una referencia para acceder al método “.close()”. ¡Gracias a todos, ayudó mucho!

---

---

Utiliza Nuestro Buscador