Угловой 4 Img src не работает

У меня проблема с изображением src в угловом 4. Он продолжает говорить мне, что изображение не найдено.

Структура папок: Здесь

Я использую изображение в mycomponent. Если в моем компоненте я вставляю напрямую

<img src="img/myimage.png"

Он отлично работает, но я проверил html и создал хэш. Но мои изображения должны быть динамически добавлены в html, потому что они являются частью списка. Итак, если я использую:

<img src="{{imagePath}}">

который в основном является «img / myimage.png», он не работает. Если я использую

<img [src]="imagePath">

Он говорит НЕ НАЙДЕН (htttps: //localhost/img/myimage.png). Вы можете мне помочь?

html,image,angular,src,

25

Ответов: 12


30

AngularJS

<img ng-src="{{imagePath}}">

угловатый

<img [src]="imagePath">

25

Скопируйте изображения в папку с ресурсами. Угловой может обращаться к статическим файлам, таким как изображения и файлы конфигурации из папки с данными.

Попробуйте вот так: <img src="assets/img/myimage.png">


Создать папку изображений в папке с ресурсами

<img src="assets/images/logo_poster.png">

2

Ну, проблема в том, что каким-то образом путь не был распознан, когда была вставлена ??в src переменной. Мне нужно было создать такую ??переменную:

path: any = require ("../../ img / myImage.png");

и тогда я могу использовать его в src. Всем спасибо!


2

в вашем компоненте назначьте переменную типа,

export class AppComponent {
  netImage:any = "../assets/network.jpg";
  title = 'app';
}

используйте этот netImage в своем src, чтобы получить изображение, как указано ниже,

<figure class="figure">
  <img [src]="netImage" class="figure-img img-fluid rounded" alt="A generic square placeholder image with rounded corners in a figure.">
  <figcaption class="figure-caption">A caption for the above image.</figcaption>
</figure>
HTML, изображения, угловые, SRC,
Похожие вопросы