javascript - remove() on img with ng-src, border remains? -

i have ng-repeated images.

<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 */   } 

some of {{data.image}} null. want remove those.

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

however when 1px border have on images still remains?

before had ng-if statement (ng-src != null), found out expensive in angular watchers.

https://jsfiddle.net/8ykrkc3c/

your onerror handler incorrect. note, it's no longer angular attribute , hence can't use angular.element.prototype.remove method. instead need go old native dom methods, in case removechild:

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

demo: https://jsfiddle.net/8ykrkc3c/2/