Сделайте img src изменяемым с помощью переменной - PullRequest
Новая
       22

Сделайте img src изменяемым с помощью переменной

0 голосов
/ 21 сентября 2018

Добавление изображения svg с помощью тега img: 

<img src="/photo1.svg" width="15" height="15">

Я хочу, чтобы src был установлен на основе значения.В этом случае наличие ng-repeat: 

<div ng-repeat="item in parent.items"
    <img src="/files/photo1.svg" width="15" height="15"> 
</div>

Зная, что item имеет другой атрибут, item.photo, который имеет в качестве значения ссылку: /files/photo1.svg, /files/photo2.svg или /files/photo3.svg.

Мой вопрос заключается в том, возможно ли в ng-repeat заставить src изменить свое значение на основе item.photo.

Кажется, что передача переменной в src не работает: 

<img src=item.photo width="15" height="15">

Я пробовал также с троичным, но не работал: 

<div ng-repeat="item in parent.items"
    <img src="item.photo === '/files/photo1.svg' ? '/files/photo1.svg' : 
              item.photo === '/files/photo2.svg' ? '/files/photo2.svg' :
              '/files/photo2.svg' " width="15" height="15"> 
</div>

1 Ответ

0 голосов
/ 21 сентября 2018

Вам необходимо использовать ng-src

<div ng-repeat="item in parent.items"
    <img ng-src="{{item.photo === '/files/photo1.svg' ? '/files/photo1.svg' : 
              item.photo === '/files/photo2.svg' ? '/files/photo2.svg' :
              '/files/photo2.svg'}}" width="15" height="15"> 
</div>

Если вы хотите присвоить значение item.photo непосредственно для src, тогда вы можете просто сделать так: 

<img ng-src="{{item.photo}}" />
...