Saltar al contenido

¿Cómo puedo cerrar un modal en Angular 2?

Si encuentras algún fallo con tu código o proyecto, recuerda probar siempre en un ambiente de testing antes aplicar el código al trabajo final.

Solución:

Usando @ViewChild

agregar #closeBtn al elemento con data-dismiss="modal"


HTML del componente


usando this.closeBtn.nativeElement.click(); para activar el evento de clic cerrará su modal.

Componente mecanografiado

import ViewChild, ElementRef from '@angular/core';
@Component(
    moduleId: ...,
    selector: '.',
    templateUrl: '.',
    styleUrls: ['.']
)
export class yourClass 
    @ViewChild('closeBtn') closeBtn: ElementRef;

    yourFunction() 
        //do something
        ...
        ...
        //close your modal
        this.closeModal();
    

    //call this wherever you want to close modal
    private closeModal(): void 
        this.closeBtn.nativeElement.click();
    

Puede hacerlo simplemente declarando la variable jQuery con cualquier tipo dentro del controlador Angular2.

declare var jQuery:any;

Agregue esto justo después de las declaraciones de importación y antes del decorador de componentes.

Luego acceda al modal de arranque con su identificación como esta.

jQuery("#myModal").modal("hide");

Además de la respuesta de @MattScarpino, otra alternativa es simplemente cambiar el tipo de botón a button de submit y llama a tu función
submitComments() y al mismo tiempo llamar dismiss-modal. al hacerlo, también puede descartar la función modal y de llamada al mismo tiempo, espero que esto pueda ayudarlo. aquí hay un ejemplo:




Actualizar

si desea cerrar modal desde el lado de su controlador, puede usar de esta manera

$("#myModal").modal("hide");

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *