Html 来自API的背景图像

我在Angular应用程序中使用Spotify API，我想知道您是否可以从API中设置对象的背景图像？ 我试过这样的东西

<div *ngIf="artist.images.length > 0">
   <div style="background-image: url("artist.images[2].url")">
   </div>
</div>

---

您在这里遗漏了一些内容，Angular需要双大括号来在模板中呈现范围变量（如果您不在指令中使用它，例如ngIf等）：

---

这可能就是您想要的：

<div *ngIf="artist.images.length > 0">
    <div ng-style="{'background-image': 'url('+artist.images[2].url+')'}"></div>
</div>

您是否尝试过：

<div *ngIf="artist.images.length > 0">
   <img [src]="url">
</div>

---

其中

url

是您的图像url。

在前面提到的双大括号旁边

根据《公约》，它应说明：

<div *ngIf="artist.images.length > 0">
  <div style="background-image: url("{{ data.artists[0].images[0].url }}")">
  </div>
</div>

---

答案在第5部分：

[ngStyle]="{'background': 'url('+artist.images[2].url+')'}"

---

当然，我忘了，但语法仍然不起作用如果我的目标是添加图像，而不是将其设置为背景，那么这就行了。我必须使用[ngStyle]来使用Angular，才能使用API中的url。在我发布问题之前，我试过了，它不起作用，因为我没有使用新的Angular语法[ngStyle]（我使用Angular 5）提示，你可以自己创造一个答案，然后接受这个答案。它甚至可能比你做的更好，因为人们期望答案包含答案，而不是问题本身包含答案。下次我会记住这一点。

[ngStyle]="{'background': 'url('+artist.images[2].url+')'}"