angularjs - switch - ng-if

La imagen no encontrada antes de angular ha actualizado el documento.

Question

Tengo una aplicación JS angular, que tiene varias imágenes, de una matriz.

Mi modelo se ve algo como esto

$scope.images = [ {url: ''someimage.png'', desc: ''some desc''}, {url: ''someimage.png'', desc: ''some desc''} ]

En mi opinión, itero sobre esto, para mostrar todas las imágenes.

<ul>
  <li ng-repeat="image in images" ><img src="{{image.url}}" /></li>
</ul>

Esto funciona, pero recibo algunos errores de página, que dicen

404 Not Found - http://localhost/{{image.url}}

Las imágenes se muestran correctamente, por lo que es evidente que las imágenes se intentan cargar antes de que Angular haya analizado para que el documento esté listo. Mis scripts también están en la cabeza, por lo que no debería ser un error de pedido de javascript.

Answer 1

El problema aquí fue que debería estar usando ng-src y no src , para que solo intente mostrar la imagen cuando Angular esté listo.

Por lo tanto, el código correcto parece

<ul>
  <li ng-repeat="image in images" ><img ng-src="{{image.url}}" /></li>
</ul>