0

Cómo agrego de fondo una imagen desde el componente CSS del componente de Angular? Lo agregué de esta forma:

body {
  background-image: url("/assets/img/principal.png") !important;
  background-position: center center !important;
  background-attachment: fixed !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
}
3
  • Como agrego una imagen de fondo. en angular para cada componente, gracias Commented el 22 may. 2020 a las 23:09
  • Buen dia: Te marca algun error,abre tu consola, ahi en la seccion de network te debera salir si se encontro la imagen? Commented el 22 may. 2020 a las 23:11
  • si sale la imagen, lo que pasa es que el css del componente no coge, ya que en la pagina la imagen sale con un espacio en blanco Commented el 23 may. 2020 a las 1:57

1 respuesta 1

1

No es posible acceder a las propiedades css que no pertenezcan al componente. Para lograr lo que quieres deberas utilizar alguna solucion como Renderer2

Este es un ejemplo de uso:

  constructor(private renderer: Renderer2) {
    
    
    renderer.setStyle(
      document.body,
      "background-image",
      'url("https://concepto.de/wp-content/uploads/2015/03/paisaje-e1549600034372.jpg")'
    );

    
  }

Te dejo un ejemplo funcional y la documentacion de Renderer2


Adicional

Te recomiendo hacer esto dentro de un servicio por que cuando abandones el componente el html continuará con los mismos estilos y tendrás que duplicar tu código para restablecer cada vez.

1

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.