正如标题所示,图像不会显示。这是我的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希望有人可以提供帮助。
答案 0 :(得分:3)
Angular是单页应用。
这意味着您只有一个页面,而index.html
。
因此,当您编写相关网址时,需要从index.html
编写,而不是从组件的位置编写。
此外,Angular CLI建议将您的资源放在assets
文件夹中,原因是:一旦缩小并捆绑,将声明为资产的文件保留在dist
中。
如果您不想这样做,则需要将图片作为资源添加到angular-cli.json
文件中。
答案 1 :(得分:1)
将所有图片放在assets文件夹中,然后尝试像这样加载
<img src="/assets/images/logo.png" alt="...">
As,Angular尝试从assets文件夹中加载所有静态内容,如图像,字体等。