Quisiera saber como puedo poner una imagen como background de un componente en Angular lo intente usando un background en el body de su css pero no me funciono.
2 respuestas
Puedes asignarle la propiedad background
con la directiva ngStyle
que es la manera que usa Angular
para modificar los estilos de los elementos, seria algo asi:
<div class="image" style="height: 100vh;width:100vw;" [ngStyle]="{'background': 'url(http://lorempixel.com/output/nature-q-c-640-480-4.jpg) no-repeat 0 0'}"></div>
Espero que te sirva, saludos.
-
si me sirvio Gracias solo una consulta mas para que ocipe todo el espacio que debo hacer?– AngelCommented el 15 sept. 2019 a las 2:44
-
debes añadirle 'background-size':'cover' a 'ngStyle' a continuacion de 'background...' separado con una coma. ([ngStyle]="{'background': 'url(TU_IMAGEN) no-repeat 0 0','background-size':'cover'})– neollobCommented el 15 sept. 2019 a las 8:30
Ponle una clase a tu contenedor y en el css del componente define el background en ese selector.
ejemplo:
.wrapperCard {
background-color: red;
}