1

Cordial saludo

La presente es para manifestar una pequeña duda técnica, tengo un pequeño problema relacionado por Lazy Load que no se como solucionar o de que forma descomponerlo, lo que sucede es que tengo, separada mi aplicación por modulos, pero dentro del app.component.html tengo mi router-outler de toda la vida, pero resulta y acontece que necesito un segundo router-outlet ya que al interior de un sidenav necesito renderizar el contenido, pero esto no sucede porque mi router-outlet del app.component me redirige a las demas vistas, que no necesito y no se como especificarle a angular que algunas rutas se rendericen dentro de el otro componente sin sacarlo a otra página, si me pudieras ayudar con este te lo agradecería, a continuación presento algunas capturas.

Esta parte de aquí es el inicio de la aplicación un header sencillo que se encuentra en una pagina separada

introducir la descripción de la imagen aquí

Esta parte es en la que tengo el problema se trata de otra ruta totalmente distinta, pero no necesito que salga del layout, sino que por el contrario que cuando le de click en cualquier de esos menús el contenido de la url que se llama se renderize al lado donde deje el mensaje

introducir la descripción de la imagen aquí

Aquí tengo mi app-component con el router-outlet de toda la vida

introducir la descripción de la imagen aquí

Estas rutas de aquí son las rutas padres creadas con LazyLoading, para este caso en particular la estoy trabajando la ruta recuperation, que es la que tiene el layout que dice responsive app donde necesito que se carguen algunos contenidos de rutas que yo asigne en ese menu (aclaro no todos los contenidos deben estar en ese lugar)

introducir la descripción de la imagen aquí

Aquí tengo las rutas de recuperation en ese sentido solo tengo una que es la que esta en el menú, llamada load (funcionando), las otras estan quemadas para hacer practicas

introducir la descripción de la imagen aquí

El problema real consiste en como hacer que angular sepa que algunas rutas solo debe renderizarlas en el interior de mi segundo layout (el de color azul) y que las demás el me las trabaje cambiando todo mi contenido o en otras palabras cambiando de url, ya que si le doy click en el menu azul, el automáticamente me lleva a la ruta de cargar recuperación que es /load en el modulo de recuperation sin sacarme de la página del layout.

Muchas gracias por la atención prestada.

Cordialmente Jean Carlo Castaño Millan

1 respuesta 1

1

Puedes tener nombrados varios <router-oulet>

<router-outlet></router-outlet>
<router-outlet name='left'></router-outlet>
<router-outlet name='right'></router-outlet>

Para definir que se renderizara en ese router-oulet necesitas una nueva propiedad:

{
  path: < base - path > ,
  component: < component > ,
  outlet: < target_outlet_name >
}

Esto va a alterar la estructura de la url.

http://base-path/primary-route-path(outlet-name:route-path)

Ver documentación RouterOutlet)

1
  • Mi amigo ya lo solucione, utilizando ng-content dentro del sidenav, te doy puntos porque me trataste de ayudar en dos publicaciones Commented el 7 abr. 2021 a las 16:52

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.