Угловой путь изображения 4/5 в html

Question

У меня есть структура рабочего пространства, которая выглядит следующим образом:

src/
   app/
   asset/
       img1.png
       img2.png
       img3.png

... Как видите, папка приложения и папка ресурсов находятся на одном уровне. Мой индексный файл также находится внутри папки src. Я пытаюсь загрузить изображение в свой компонент, но не могу его отобразить, и все время получаю сообщение об ошибке, например:

GET http://localhost:4200/asset/img1.png 404 (Not Found)

мой HTML выглядит так:

<img style="height: 395px; width: 360px;" src="asset/img1.png">

Любое решение для пути?

Answer 1

Добавьте вашу папку в .angular-cli.json файл, как показано ниже.

Здесь необходимо добавить все пользовательские файлы, созданные из папки src.

"apps": [{
    "root": "src",
    "outDir": "dist",
    "assets": [
        "assets",
        "asset" // <-- Like this
    ],
........
}]

Answer 2

По умолчанию имя папки для активов - assets. Это установлено в .angular-cli.json в настройках apps->assets.

Когда вы положите туда свои файлы, вы сможете связать их точно так же, как вы: <img style="height: 395px; width: 360px;" src="assets/img1.png">