Detailed explanation of how to customize Img's ng-load event in Angularjs

In the process of using AngularJs, we often use some ng-events, such as ng-click, ng-change, etc. These events are defined for us in advance by AngularJs. In some cases, we will use some dom events that are not used frequently, such as img's onload (triggered after the image is loaded), but this event is not available in AngularJs by default. So how should we customize the ng-load event?

Just add the following command to the app object:

('imageonload', function () {
  return {
    restrict: 'A', link: function (scope, element, attrs) {
      ('load', function () { 
        //call the function that was passed 
        scope.$apply();
      });
    }
  };
})

Append events directly using the imageonload property in HTML:

<img ng-src="{{src}}" imageonload="doThis()" />

Finally, write the corresponding event content in the controller:

$=function(){
 //your own code
}

The above is all the content of this article. I hope it will be helpful to everyone's study and I hope everyone will support me more.