图像未使用angular7设置为背景图像?
我有一个图像未使用angular7设置为背景图像?,angular,typescript,background-image,Angular,Typescript,Background Image,我有一个卡列表将显示在组件中。在每张卡片上都有一个封面图片,其url来自服务器,在我的组件.html中有一个ngFor,如下所示 <div [style.background-image]="'url('+row.companyId?.coverUrl+')'" class="img-area"> </div> <div class="card-content-area"> <p class="card-title cursor-pointer"
卡列表
将显示在组件中
。在每张卡片上都有一个封面图片
,其url来自服务器,在我的组件.html中有一个ngFor
,如下所示
<div [style.background-image]="'url('+row.companyId?.coverUrl+')'" class="img-area">
</div>
<div class="card-content-area">
<p class="card-title cursor-pointer" (click)="navigateToCOmpany(row)">{{row.companyId.name}}</p>
<div class="card-description-area">
<p class="site-text">{{row.offer_desc}}</p>
</div>
<a (click)="referralClick(row, i)" class="site-btn show-desktop-block">Get referral link</a>
<a (click)="referralClick(row, i)" class="site-link-mobile show-mobile-block"><i class="fa fa-link mobile-link" aria-hidden="true"></i> Get Referral link</a>
</div>
{{row.companyId.name}
{{row.offer\u desc}
请确定我做错了什么?你能试试ngStyle吗
<div [ngStyle]="{'background-image': 'url(' + row.companyId?.coverUrl + ')'}" class="img-area">
我会尝试为我的div添加一些高度和宽度
尝试使用随机值:
.img-area{
height:50px;
width:50px;
}
尝试通过打印某处来查看您是否获得imag url{{row.companyId.coverUrl}}您是否看到我问题中附带的图片?我在inspect Element中获取url是否已检查显示的url是否正常>是,我已检查。它工作正常。您在控制台中是否收到有关清理链接的特定消息?不,我没有收到任何有关链接清理的警告是的,您是对的。它起作用了。谢谢你的帮助。:)你能告诉我另一件事吗?@Fahadhassansubzwar我一定要告诉我想检查行.companyId?.coverUrl
是否存在以将该url放在backgound属性中,如果不存在,请应用硬编码url,如/assets/img/abc.jpg
,那么根据我的代码,我该怎么做呢?@Fahadhassassansubzwar你能再做一个吗张贴我会很高兴地帮助我只是在这类事情的工作,我想我有答案,谢谢提前