为什么 ngStyle 背景图像没有加载？

【问题标题】：Why is ngStyle background-image not loading?为什么 ngStyle 背景图像没有加载？
【发布时间】：2020-08-26 10:18:52
【问题描述】：

我无法显示我的图片。以前是显示的。在我的容器/介绍模板中，我有：

<div mat-card-image class="quiz-topic-image"
      [ngStyle]="{ 'background': 'url(' + quizData?.imageUrl + ') no-repeat center center',
                   'background-size': '95%' }">
    </div>

在我的 quiz.ts 文件中，我有 imageUrl: 'DIDiagram.png',

图片在 assets/images/DIDiagram.png 中

我尝试更改图像的路径，但似乎没有任何效果。请你帮忙。谢谢。

【问题讨论】：

您是否在控制台中遇到任何错误？

标签： angular ng-style

【解决方案1】：

写background（no-repeat和center center是background属性）而不是background-image

 imageUrl: './../assets/images/DIDiagram.png'

<div mat-card-image class="quiz-topic-image"
      [ngStyle]="{ 'background': 'url(&quot;' + quizData?.imageUrl + '&quot;) no-repeat center center',
                   'background-size': '95%' }">
    </div>

【讨论】：

是的，我已将其更改为后台，但仍未显示...现在我进入 Chrome：加载资源失败：服务器响应状态为 404（未找到）
你现在能检查一下图像是否以它的样式写入，并且来自 console.log 的图像名称正确吗？
这是我检查元素时得到的：
您能否再次尝试编辑答案的问题可能是"
你也应该在你的 url 前面写下资产路径