1. 程式人生 > >angular 圖片加載失敗 情況處理? 如何在ionic中加載本地圖片 ?

angular 圖片加載失敗 情況處理? 如何在ionic中加載本地圖片 ?

bind c中 url rip 失敗 圖片加載 正常 app 但是

1.angular 圖片加載失敗 情況處理

在directive中定義組件,在ng-src錯誤時,調用err-src

app.directive(‘errSrc‘,function(){
  return {
    link: function(scope, element, attrs){
      if(attrs.src == ‘undefined‘){
        attrs.$set(‘src‘, attrs.errSrc);
      }
      element.bind(‘error‘, function() {
        if (attrs.src != attrs.errSrc) {
          attrs.$set(‘src‘, attrs.errSrc);
        }
      });
    }
  }
});

頁面調用:

<img ng-src="item.url" err-src="img/error.png" />

2.如何在ionic中加載本地圖片 ?

對於css文件夾中的樣式文件中如果要調用本地的圖片的話,從該css文件所在的文件夾開始算。

例如www/css/style.css要加../,否則在瀏覽器中可以正常顯示,在設備上不行。

結構如下所示:

.login-page {
  background:url(../img/signup_bg.png);
  background-size: cover;
  background-repeat: no-repeat;
}

但是對於在頁面中定義的圖片路徑,www

路徑開始算,否則瀏覽器中可顯示,但設備上不行,img文件夾和index.html在一級,如:

<img src="img/commander.jpg" />

.

angular 圖片加載失敗 情況處理? 如何在ionic中加載本地圖片 ?