如何在背景图像url ionic中连接动态图像路径

Question

我试图连接一个静态的静态路径和一个动态路径，它是图像的路径，到图像URL我每次在路径之间添加+时都会遇到语法错误我试过这个

<div *ngFor="let cat of Cat" class="cus-col" style="background-image: url( 'Static Image Url'  '+ Dynamic Image Url'  ) ">}
        <div class="cus-text">
          <h4>{{cat.name}}</h4>
        </div>
      </div>

Answer 1

由于您使用的是Ionic，因此应使用Angular NgStyle指令来设置元素样式。

此示例使用动态URL设置div的背景图像：

<div [ngStyle]="{'background-image': 'url(' + dynamicVariable + ')'}"></<div>

此示例使用静态和动态URL设置div的背景图像：

<div [ngStyle]="{'background-image': 'url(https://www.example.com/images/' + dynamicVariable + ')'}"></<div>

您可以在此处了解更多信息：

https://codecraft.tv/courses/angular/built-in-directives/ngstyle-and-ngclass/