如果原件不存在,则角度显示默认图像

如果图像存在，我想显示用户图像，如：

<img alt="user_image" src="/images/profile_images/{{result.image}}">

如果用户图像不可用，那么应该显示默认图像，喜欢

<img alt="user_image" src="/images/default_user.jpg">

如何通过html页面中的angularjs来做到这一点？

您可以创建一个指令checkImage来检查图像是否真的存在：

<img check-image ng-src="{{img}}" alt="Image" width="100%"  >

指示：

myApp.directive('checkImage',function($http) {
    return {
        restrict: 'A',link: function(scope,element,attrs) {
            attrs.$observe('ngSrc',function(ngSrc) {
                $http.get(ngSrc).success(function(){
                    alert('image exist');
                }).error(function(){
                    alert('image not exist');
                    element.attr('src','/images/default_user.jpg'); // set default image
                });
            });
        }
    };
});

见演示http://jsfiddle.net/manzapanza/dtt1z5p8/

原文地址：https://www.jb51.cc/angularjs/144215.html