El calendario del selector de fechas de material angular se muestra detrás del modal angular

Revisamos de forma cada tutoriales en nuestro sitio web con la meta de mostrarte siempre la información veraz y certera.

Solución:

solo necesita poner esto en la plantilla html del modal:

La respuesta aceptada está desactualizada. Para @angular/material 5.0.0-rc0 han utilizado con éxito:

.cdk-overlay-container z-index: 1200 !important; 

https://stackoverflow.com/a/47274694/1225421

Terminé yendo a angular-material.css y cambié el índice Z a 1151.

 .md-datepicker-calendar-pane 
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1151;
  border-width: 1px;
  border-style: solid;
  background: transparent;
  -webkit-transform: scale(0);
          transform: scale(0);
  -webkit-transform-origin: 0 0;
          transform-origin: 0 0;
  transition: -webkit-transform 0.2s cubic-bezier(0.25, 0.8, 0.25, 1);
  transition: transform 0.2s cubic-bezier(0.25, 0.8, 0.25, 1); 
  .md-datepicker-calendar-pane.md-pane-open 
    -webkit-transform: scale(1);
            transform: scale(1); 

Si entiendes que te ha resultado de utilidad nuestro artículo, te agradeceríamos que lo compartas con el resto entusiastas de la programación de este modo contrubuyes a extender nuestra información.

---

---

Utiliza Nuestro Buscador