0

Estoy trabajando en mi primer proyecto para la universidad, dentro del mismo tengo un componente para la vista de iniciar sesion, pero al apretar el boton que me deberia mandar al mismo, los componentes se cargan uno sobre otro, comparto como se ve el html antes de presionar 'iniciar sesion' y como se ve despues:Antes de hacer click en el boton:

Despues de apretar el boton:

mi archivo de app-routing.module.ts:

import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { IniciarSesionComponentComponent } from './iniciar-sesion-component/iniciar-sesion-component.component'; // Asegúrate de que la ruta del componente sea correcta

const routes: Routes = [
  { path: 'iniciar-sesion', component: IniciarSesionComponentComponent },
];

el codigo html de app.component.html es:

<router-outlet></router-outlet>
<body>
  <div class="container-fluid vh-100 d-flex align-items-center justify-content-center m-0 p-0">
    <div class="text-center">
      <h1>ScoutLink</h1>
      <h5>Tu talento merece ser descubierto.</h5>
      <div class="mt-4">
        <a class="btn btn-primary btn-outline-dark btn-lg px-5 py-3 me-sm-3 fs-6 fw-bolder" routerLink="/iniciar-sesion">Iniciar Sesion</a>
        <a class="btn btn-primary btn-outline-dark btn-lg px-5 py-3 me-sm-3 fs-6 fw-bolder" href="resume.html">Registrarse</a>
      </div>
    </div>
  </div>
</body>

1 respuesta 1

1

El problema es que estás cargando el router outlet dentro de otra vista, para que no se cargue un componente dentro de otro debes separar las dos páginas en componentes independientes.

https://angular.io/guide/component-overview

Además de esto debes crear las rutas correspondientes y usar un routerLink o la librería de router para navegar entre las vistas.

https://angular.io/tutorial/tour-of-heroes/toh-pt5

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.