(Угловой) Изображение не будет отображаться

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

Angular - это одностраничное приложение .

Это означает, что у вас есть только одна страница, и это index.html.

Итак, когда вы пишете свои относительные URL, вам нужно писать их с index.html, а не с того места, где находится ваш компонент.

Кроме того, Angular CLI рекомендует поместить ваши ресурсы в папку assets, и по причине: после минимизации и объединения только файлы, объявленные как ресурсы, остаются в вашем dist.

Если вы не хотите этого делать, вам нужно добавить свое изображение в качестве актива в файл angular-cli.json.

Answer 2

Поместите все изображения в папку активов и попробуйте загрузить их следующим образом

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

Как, Angular попытается загрузить весь статический контент, например изображения, шрифты и т. Д., Из папки ресурсов.