删除（）在img与ng-src，边界仍然是？

我有一些重复的图像。删除（）在img与ng-src，边界仍然是？

<img ng-src="{{::data.image}}" />

CSS：

.thumbnailImage { 
    width: auto; 
    max-width: 20px; 
    height: auto; 
    max-height: 20px; 
    border: 1px solid lightslategrey; 
    position: relative; 
    display: block; 
    margin-left: auto; 
    margin-right: auto; 
    background-color: white; /* in case of png */ 
    }

一些{{data.image}}为空。我想删除这些。

<img ng-src="{{::data.image}}" onerror="this.remove()" />

但是，当我这样做的1px的边界，我对图像仍然存在？

在此之前，我有一个ng-if语句（ng-src！= null），但是我发现这在角度观察者中太昂贵了。

https://jsfiddle.net/8ykrkc3c/

来源

2016-04-25 Anders Pedersen

试试这个

<div ng-if="data.image"> 
    <img ng-src="{{::data.image}}" /> 
</div>

编辑：

您可以使用custome dirctive这一点。

angular.module("app", []) 
 
    .controller("MainCtrl", function($scope) { 
 
    $scope.value = "https://www.google.co.in/images/srpr/logo11w.png"; 
 
    // $scope.value = "null"; 
 
    }) 
 
    .directive('custSrc', function() { 
 
    return { 
 
     restrict: "A", 
 
     scope: { 
 
     value: "=custSrc" 
 
     }, 
 
     link: function(scope, element, attrs) { 
 
      if(scope.value == 'null') 
 
      element.parent().addClass('hide'); 
 
      else 
 
      element.attr('src', scope.value); 
 
     
 
     console.log(element); 
 

 
     } 
 
    }; 
 
    });

.hide{ 
 
    display:none; 
 
    }

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="app" ng-controller="MainCtrl"> 
 
    <img cust-src="value" /> 
 
</div>

来源

2016-04-25 07:38:39

与数据的量，我有，一NG，如果是要在观察家昂贵。 –

所以请使用custome指令。 –

@AndersPedersen你也可以一次性绑定它，如果src不会改变 –

你的onerror处理程序不正确。请注意，它不再是Angular属性，因此您不能使用angular.element.prototype.remove方法。相反，你需要去用好老的原生DOM方法，你的情况removeChild：

<img class="asd" ng-src="{{::data.image}}" onerror="this.parentNode.removeChild(this)" />

演示：https://jsfiddle.net/8ykrkc3c/2/

来源

2016-04-25 08:07:16 dfsq

你的演示使用'ng-src'而不是'src'。因为演示中没有Angular，所以'ng-src'并不意味着什么也不做，因为没有'src'属性。如果没有src，onload/onerror事件不会被img元素触发。 – dfsq

删除（）在img与ng-src，边界仍然是？

回答

相关问题