Modal en Angular sin Librerías Externas 🥇

Hey! qué tal geeks, aquí te enseño a realizar un modal en Angular 11+ sin utilizar librerías externas como Bootrap. Vamos a crear un modal en Angular utilizando unicamente las herramientas nativas que nos proporciona este framework; en este caso usaremos Observables.

Aprende a crear modal con Angular 11 sin librerías.

🥇 Sígueme en mis redes sociales

[frenesei]

Para los que necesiten la transparencia y en general los estilos del componente del modal:

.modal{
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(255, 255, 255, 0.8);
z-index: 2;
display: flex;
justify-content: center;
align-items: center;
}

Pd: Gracias por el vídeo, me ayudaste mucho.

[mauroa]

Explicaste cada cosa detalladamente!!, solo venia a ver que era un modal y me cerraron otras cosas que no entendía no sabia que necesitaba este video hasta que lo vi. Me hiciste feliz amigo, gracias!

[laurap]

Muchas gracias por este tutorial, me ha servido de muchisimo!

[CristoferOffice]

Que tal amigo, buen video, una consulta tendria que crear n numeros de servicios para cada modal que quiera aplicar a la pagina?

[juliocesaramadortejeda]

Entonces debería crear n servicios dependiendo del número de modales que tenga en mi app? Ya que si no todos estarías escuchando el mismo observable cierto?

[alexandrofernandez]

Muy bien explicado carnal, gracias y muy buen video.

[SergieArizandieta]

Que buena explicacion te mereces el cielo

[MrMagnezone]

Excelente video, amigo, te podría pedir el repo para ver como creaste el css?

[ronaldbaronsanchez]

quisiera ver como manejar el opacity porfa al dar clic

[leandrocanalda]

Excelente tutorial, me cansé de leer en otros lados cosas que no funcionaban o no cerraban por falta de explicación.

[luisroca]

parce su video me gusto mucho y me ayudo pero me gastaría ver el código porque no c como cuadrar el css bien jeje un abrazo y mucho exito

[rominamatematica]

Hola, muy buen video! Gracias!! Podrías orientarme para poder evitar que se desplace lo que ya tenía en la página? Es decir para que quede fijo por detrás del modal. Sería genial!! Gracias otra vez!!

[santifpv]

Amigo podrías compartir el código. La clase modal no me funciona

[jorgecastillo]

Hola Oscar, quisiera hacerte una pregunta, ¿Por qué el vs no te alega que no has inicializado la variable modalSwitch? es alguna config o algo?,
pd: apenas estoy aprendiendo angular

[armandopenaleonett]

Una pregunta, hay necesidad de usar un servicio para esta funcionalidad ?, es mala practica crear el eventEmitter en el componente hijo ? en este ejmplo que es sencillo no veo la necesidad de crear un servicio ... lo digo por que quiero aplicarlo en un proyecto personal y justo donde lo necesito tampoco veo la necesidad de crear un servicio para esto

[johnpineda]

Hice todo lo del video, pero no me abre el modal pero si llega al metodo que vuelve true el modal... Que podría ser?