2

Tengo el siguiente menú el cual se muestra al iniciar mi aplicación en angular, mi problema es que no me redirecciona a las paginas que vienen ahi y me sale el siguiente error en el log, que no se a que se deba, por que ya instale el package de FontAwesomeModule y lo importe en mi app.module.ts

<div class="container>
    <div class="col-sm-6">Menú principal</div>
        <div class="center">
            <a routerLink="/consulta-datos-uno" routerLinkActive="active" >
                <fa-icon [icon]="faClock" class="coloricon fa-2x"></fa-icon>
                <label class="letraicon">Consultar datos 1</label>
            </a>
        </div>
        <div class="center">
            <a  routerLink="/consulta-datos-dos" routerLinkActive="active">
                <fa-icon [icon]="faBook" class="coloricon fa-2x"></fa-icon>
                <label class="letraicon">Consultar datos 2</label>
            </a>    
        </div>                
</div>

Error:

error NG8002: Can't bind to 'icon' since it isn't a known property of 'fa-icon'.

  1. If 'fa-icon' is an Angular component and it has 'icon' input, then verify that it is part of this module.
  2. If 'fa-icon' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.
  3. To allow any property add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component.+ <fa-icon [icon]="faHist" class="fa-2x">

Lo raro es que ese error me lo indica en los icon que yo uso en mi pagina a la que quiero redireccionar desde el menu principal, es decir, en la pagina consultar-datos-uno en esta parte <fa-icon [icon]="faHist" class="fa-2x">

tengo lo siguiente en el archivo app-routing-module.ts

  const routes: Routes = [
  {path:'sm/:session', children: [], canActivate: [HeaderSessionGuard]},
  {path:'', redirectTo: 'menu-principal', pathMatch: 'full' },
  {path: '**', redirectTo: 'menu-principal',pathMatch: 'full',},
  {path:'menu-principal', component: MenuPrincipalComponent, canActivate: [SessionGuard]},
  {
        path: 'consulta-datos-uno',
        loadChildren: () => import('./consulta-datos-uno/consulta-datos-uno.module').then(mod => mod.ConsultaDatosUnoModule),
        canActivate: [SessionGuard],
    }
 
];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule { }

y en el componente cosulta-datos-uno, tengo estos archivos, el primero es el consulta-datos-uno-routing-module.ts

  const routes: Routes = [
  {
    path: '',
    component: ConsultaDatosUnoComponent
  },
];

@NgModule({
  imports: [RouterModule.forChild(routes)],
  exports: [RouterModule],
})
export class ConsultaDatosUnoRoutingModule {}

consulta-datos-uno-module.ts:

@NgModule({
  declarations: [ConsultaDatosUnoComponent],
  imports: [CommonModule, ConsultaDatosUnoRoutingModule, ReactiveFormsModule],
})
export class ConsultaDatosUnoModule {}

consulta-datos-uno.component.ts:

 @Component({
        selector: 'app-consulta-datos-uno',
        templateUrl: './consulta-datos-uno.component.html',
        styleUrls: ['./consulta-datos-uno.component.css']
    })
    export class ConsultaDatosUnoComponent implements OnInit {

        faHist = faCalendarAlt;
        faClock = faClock;
        faVal = faChartLine;

  constructor() { }

  ngOnInit(): void {
    $('#iconosSalir').show();
  }

}

consulta-datos-uno.html:

 <div class="container">
        <div class="col-sm-6">Submenu</div>
            <div class="center">
                <a routerLink="/consulta-pagos" routerLinkActive="active" >
                    <fa-icon [icon]="faHist" class="fa-2x"></fa-icon>
                    <label class="letraicon">Consultar pagos</label>
                </a>
            </div>
            <div class="center">
                <a routerLink="/consulta-inventario" routerLinkActive="active"  >
                    <fa-icon [icon]="faClock" class="fa-2x far"></fa-icon>
                    <label class="letraicon">Consultar inventario</label>
                </a>
            </div>
    </div>

como puedo resolver ese error que hace referencia al uso de los fa-icon? y ver que si funcione mi redireccionamiento o que puede estar mal en esa parte?

0

Tu Respuesta

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

Examina otras preguntas con la etiqueta o formula tu propia pregunta.