2

estoy haciendo un trabajo en angular donde instale angular material de la siguiente forma: ng add @angular/material esto me puso en mi index.html la siguiente linea de codigo: <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">, por lo que entendi de la documentacion es que angular material obtiene los iconos desde Google Material Icons con el nombre y asi es solo que para poderlos usar debo importar el modulo en mi app.module.ts, lo cual hice asi:

import { MatIconModule } from '@angular/material/icon';

@NgModule({
  declarations: [
     ...
  ],
imports: [
  ...,
  MatIconModule
]
})
export class AppModule { }

Esto para posteriormente usarlo como: <mat-icon>priority_high</mat-icon> dentro de cualquier componente. Pero esto no ocurre asi, ya que se ve de esta forma:

introducir la descripción de la imagen aquí

donde se puede observar que solo se escribe el texto contenido en el mat-icons mas no se muestra el icono.

Ahora, segun las peticiones http en el menu de red del navegador en efecto se mandan a llamar las url y regresan correctas con status(200) pero entonces porque no funcionan, sera porque estoy corriendo mi aplicacion en un puerto distinto al 4200?

1
  • 1
    lo del puerto no creo que sea el problema si todo lo haces mediante ese puerto ... por que en teoria el acceso a recursos si es /recurso/... entendera y resolvera en el mismo puerto ... Commented el 25 ene. a las 20:23

1 respuesta 1

2

Tras tomar como referencia el comentario y comprobar que mis fuentes de google APIs si funcionaban me puse a investigar como funciona material icons, el problema era mas sencillo que la solucion, en mis styles.css tenia esta sentencia:

*{
   font-family: 'Inter', sans-serif !important;
}

Con lo que no contaba era que el icono se generaba con una font-family por lo que esa linea negaba el anterior..! y solo con quitarle el important funciono..!

1
  • 1
    ha que bueno que lo encontraste ... esos son errores tipograficos ... aveces una coma o un punto mal puesto y todo explora... en este caso tenia un superposicion de fuentes. Commented el 25 ene. a las 21:57

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.