Подготовка ссылок в цикле

Question

Существует множество объектов. Я выхожу из своей петли. В обеих сериалах, чтобы получить ссылку на изображение? vm.data.list- массив объекта. Loop:

<tr ng-repeat="item in vm.data.list"> 
       <td ng-bind="item.temp.day"></td> 
       <td ng-bind="vm.symbal"></td> 
       <td ng-bind-template="{{ item.humidity }} %"></td> 
         </tr> 

Как и в цикле получения ссылки на изображение? (http://openweathermap.org/img/w/vm.data.list[0].weather[0].icon.png, http://openweathermap.org/img/w/vm.data.list[1].weather[0].icon.png и другие)

Я пытался сделать так:

<tr ng-repeat="item in vm.data.list"> 
       <td ng-bind="item.temp.day"></td> 
       <td ng-bind="vm.symbal"></td> 
       <td ng-bind-template="{{ item.humidity }} %"></td> 
     <!--  <td img ng-src="http://openweathermap.org/img/w/{{item.weather[0].icon.png}}">--> 
       <td> <img src=http://openweathermap.org/img/w/{{item}}.weather[0].icon.png></td> 
       </tr> 

Answer 1

вам нужно использовать ng-src вместо src: https://docs.angularjs.org/api/ng/directive/ngSrc. Сначала Angular сначала вычислит значение ng-src, а затем построит src для вас.

Вот простой пример: jsfiddle:

<div ng-repeat="item in items"> 
    <img ng-src="http://www.w3schools.com/{{item.f.folders[0]}}/{{item.name}}"> 
</div> 

В вашем случае, использование:

<img ng-src="http://openweathermap.org/img/w{{item.weather[0].icon}}.png‌​"> 

Помимо нг-Src, имейте в виду, что:

• в url, начинающийся с чего-то другого, кроме протокола или косой черты, является родственник: он будет b e разрешено против контекста текущей страницы. В вашем случае не забудьте указать http: // в начале!
• все угловое выражение внутри ссылки должно быть в скобках: {{item}}.weather[0] не будет работать