Angular中的ngStyle背景图像

时间:2019-05-21 08:28:27

标签: angular cordova ionic-framework

我在div元素上使用ngStyle标记来设置图像,但是图像无法正常工作,

我尝试如下设置ngStyle背景

<div  [ngStyle]="{'background-image': 'url(${profilePicPrefix + profileService.userDetails.profile_img})'}"  class="profilepic">
</div> 

[ngStyle]="{'background-image': 'url('+ profilePicPrefix + profileService.userDetails.profile_img +')'}"  
// not working - String concatenation 

[ngStyle]="{'background-image': 'url(${profilePicPrefix + profileService.userDetails.profile_img})'}"
// not working

我正在显示黑屏,图像无法渲染,但是构建成功。

3 个答案:

答案 0 :(得分:0)

我使用了给定的东西,请尝试

 [ngStyle]="{'background-image':'url(' + profileService.userDetails.profile_img + ')'}"

答案 1 :(得分:0)

您忘记在圆括号内添加引号。

尝试一下

[ngStyle]="{'background-image': 'url("'+ profilePicPrefix + profileService.userDetails.profile_img +'")'}" 

答案 2 :(得分:0)

尝试

 [style.background-image]="'url('+ profileService.userDetails.profile_img +')'">