각도가 깨진 이미지가 표시되지 않도록 JS

저는 AJS에 익숙하지 않으므로 소리가 어리지만 이미지 URL이 표현식이나 사용자 입력에서 오는 경우 깨진 이미지를 피하는 방법을 알고 싶습니다. 어쩌면이 설명 :각도가 깨진 이미지가 표시되지 않도록 JS

<html ng-app> 
<head> 

</head> 

<body> 

Name :<input type="text" ng-model="batman" /> 

<img ng-src="{{batman}}.png" /> 


<script src="script/angular.min.js"></script> 
</body> 
</html>

지금 내가 그 폴더에있는 몇몇 사진을 가지고 있고 나는 그들이 페이지에 표시되는 텍스트 줄에 입력 할 때 내가 원하는. 정확한 이미지 이름을 입력하지 않으면 항상 깨진 이미지가 표시됩니다. 깨진 이미지가 나타나지 않도록하는 방법이 있습니다. 배트맨 모델이 존재하는 경우에만이 DIV 여기

출처

2014-09-05 coljadu

<div ng-if="batman"> 
    <img ng-src="{{batman}}.png" /> 
</div>

는, ngSrc의 값은 (는) '로드'이벤트를보고 할 때까지 변경 될 때 이미지 요소를 숨기는 지침입니다 이 요소 (plunker) 표시

app.directive('hideUntilGood', function() { 
    return { 
    restrict: 'A', 
    multiElement: true, 
    link: function(scope, element, attrs) { 
     attrs.$observe('ngSrc', function (value) { 
     // fix where ngSrc doesn't update when blank 
     if (!value || value.length == 0) { 
      element.attr('src', value); 
     } 
     element.css("display", "none"); 
     }); 
     element.bind('load', function() { 
     element.css("display", ""); 
     }); 
    } 
    };

을})

사용법 :

<img hide-until-good ng-src="{{batman}}.png">

출처

2014-09-05 17:54:37 Vamsi

를 렌더링 감사

출처

2014-09-05 18:41:21

각도가 깨진 이미지가 표시되지 않도록 JS

답변

관련 문제