角度属性が空の場合は要素を隠す

Question

角度オブジェクトにある属性からパスを取得している画像要素があります。しかし、この（imagePath）が空の場合、私は壊れた画像を取得します。属性が空の場合はイメージをレンダリングしませんが、これを行う方法はありません。何か案は？

<img width="50px" src="/resources/img/products/{{current.manufacturerImage.imagePath}}"> 

Answer 1

ngHideディレクティブをチェックアウトします。

コードは次のようになります。また

<img width="50px" ng-hide="current.manufacturerImage.imagePath == ''" 
src="/resources/img/products/{{current.manufacturerImage.imagePath}}"> 

、また、あなたはまた、要素を非表示にし、そのオブジェクトがnullまたは未定義であるかどうかを確認するために、これを更新することができdarkporter

<img width="50px" ng-show="current.manufacturerImage.imagePath" 
src="/resources/img/products/{{current.manufacturerImage.imagePath}}"> 

によって提案を試みることができます。

Answer 2

ユーザーの役割に基づいてイメージリンクを生成していたため、この提案は役に立たなかったでしょう。ユーザーには役割がありましたが、それは関連するイメージを持っていたわけではありません。

だから私はディレクティブを作成：だから

angular.module('hideEmptyImages', []) 
.directive('hideEmptyImage',function() { 
    return { 
     Restrict: 'AE', 
     Link: function (scope, elem, attrs) { 
      elem.error(function() { 
       elem.hide(); 
      }); 
     } 
    }; 
}); 

：.imagePathが空の場合、または単に関連するイメージがない場合

<img hide-empty-image width="50px" src="/resources/img/products/{{current.manufacturerImage.imagePath}}"> 

は表示されません。