각도가 문서를 업데이트하기 전에 이미지를 찾을 수 없습니다.

각도가 문서를 업데이트하기 전에 이미지를 찾을 수 없습니다.

저는 배열된 이미지가 여러 개 있는 각진 JS 어플리케이션을 가지고 있습니다.

제 모델은 이렇게 생겼습니다.

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

저는 모든 이미지를 보여주기 위해 이 일을 반복합니다.

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

이 방법은 효과가 있지만 페이지 오류가 좀 발생합니다.

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

이미지가 올바르게 표시되고 있으므로 Angular가 문서를 준비하기 위해 파싱하기 전에 이미지를 로드하려고 하는 것이 분명합니다.제 스크립트도 머리 부분에 있으니 자바스크립트 주문 오류가 없어야 합니다.

여기서 문제는 제가 사용해야 한다는 것이었습니다.ng-src아닌src, Angular가 준비되었을 때에만 이미지를 표시하도록 합니다.

그래서 정확한 코드는

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

언급URL : https://stackoverflow.com/questions/17967626/image-not-found-before-angular-has-updated-document