ionic开发——图片加载失败或不存在时显示提示图片的解决方法

当图片加载失败或者不存在的时候，我们需要一张提示图片来代替他。用判断就太麻烦了，img有自己的方法onerror , 当找不到图片的时候就会执行onerror里面的代码

例如：

<img src="1.jpg" onerror="2.jpg"/>

当1.jpg找不到的时候，会自动加载2.jpg. 

那如果2.jpg也找不到怎么办？就会一直执行onerror里面的代码，陷入死循环。

所以，我们可以这么写，代码如下：

<img src="1.jpg" alt="" onerror="nofind(this)">

JS代码：

function nofind(obj){
obj.src = '2.jpg';
obj.onerror = null;
}

当图片加载失败的时候，如果我们还有其他需求，都可以写在这个nofind()方法里了

那么，在ionic开发中，angularjs里怎么使用呢？angualrjs 代码如下：

<img ng-src="1.jpg" err-src="2.jpg"/>

JS代码如下：

var app = angular.module("MyApp", []);
app.directive(‘errSrc‘, function() {
return {
link: function(scope, element, attrs) {
element.bind(‘error‘, function() {
if (attrs.src != attrs.errSrc) {
attrs.$set(‘src‘, attrs.errSrc);
}
});
}
}
});

如果需要执行其他的程序写在element.bind('error',function(){} 这个方法里面就可以。具体操作可以输出scope,element,attrs查看里面的属性和方法进行操作，不懂得可以评论留言给我。

希望可以帮助到大家，谁有更好的方法，可以评论给我