后备图像的Angular指令

Mat*_*ork 62 angularjs angularjs-directive

如果不存在单独服务器上的图像,我想显示默认图像.是否有角度指令来实现这一目标?

Ket*_*tan 125

不,但你可以创建一个.

http://jsfiddle.net/FdKKf/

HTML:

<img fallback-src="http://google.com/favicon.ico" ng-src="{{image}}"/>
Run Code Online (Sandbox Code Playgroud)

JS:

myApp.directive('fallbackSrc', function () {
  var fallbackSrc = {
    link: function postLink(scope, iElement, iAttrs) {
      iElement.bind('error', function() {
        angular.element(this).attr("src", iAttrs.fallbackSrc);
      });
    }
   }
   return fallbackSrc;
});
Run Code Online (Sandbox Code Playgroud)

  • 这是一个很好的指令.我遇到了问题因为ng-src也可能是空值.这是我的修复.我希望它有所帮助.https://gist.github.com/jpotts18/7161375 (4认同)
  • 只需使用`iAttrs.$ set('src',iAttrs.fallbackSrc)` (3认同)