（角度）图像不会显示

Question

正如标题所示，图像不会显示。这是我的 component.html 中的代码

<div>
    <img src="logo.png" alt="...">
</div>

当我查看 chrome 的控制台时，它给了我这个错误

Failed to load resource: the server responded with a status of 404 (Not Found)            logo.png

logo.png 文件与 component.html 位于同一文件夹中。这是怎么回事？我能做什么？我目前使用 Angular CLI：1.7.4；节点：8.11.1；打字稿：2.8.1 希望有人可以提供帮助。

Answer 1

将所有图像放入资产文件夹中并尝试像这样加载

<img src="/assets/images/logo.png" alt="...">

因为，Angular 尝试从资源文件夹中加载所有静态内容，如图像、字体等。

Answer 2

Angular 是一个单页应用程序。

这意味着您只有一页，那就是index.html.

因此，当您编写相对网址时，您需要从 编写它们index.html，而不是从组件所在的位置编写它们。

此外，Angular CLI 建议将您的资源放入该assets文件夹中，原因是：一旦缩小并捆绑，只有声明为资产的文件才会保留在您的dist.

如果您不想这样做，则需要将图像作为资产添加到文件中angular-cli.json。