如何在[ngStyle] Angular 5中将图像用作背景

时间:2018-07-06 08:42:59

标签: angular

我正在尝试使Div的背景已经保存在数据库中 所以我尝试在Angular中使用[ngStyle],但没有成功

<div class="image" [ngStyle]="{'background': ' url(' + imageUrl  + ') no-repeat 0 0'}"></div>

但是当我将其用作

<img [src]="imageUrl || img.src" alt="" class="img">

有效

3 个答案:

答案 0 :(得分:2)

您可以使用InputStream中的heightwidth

div

答案 1 :(得分:1)

这项工作有效吗??

[style.background-image]="'url('+imageUrl+')'"></div>

答案 2 :(得分:0)

您需要设置div标签的heightwidth。因为 div 标签的高度和宽度默认为0px:

<div class="image" [ngStyle]="{'background': 'url(' + (imageUrl)? imageUrl : none  + ')  no-repeat 0 0', 'height': '200px', 'width': '200px'}"></div>

您需要像这样检查imageUrl的条件:

(imageUrl)? imageUrl : none