Sunday 16 June 2019
angularjs - What's the best way to cancel event propagation between nested ng-click calls?
Answer
Answer
Here's an example. Let's say I want to have an image overlay like a lot of sites. So when you click a thumbnail, a black overlay appears over your whole window, and a larger version of the image is centered in it. Clicking the black overlay dismisses it; clicking the image will call a function that shows the next image.
The html:
The javascript:
function OverlayCtrl($scope) {
$scope.hideOverlay = function() {
// Some code to hdie the overlay
}
$scope.nextImage = function() {
// Some code to find and display the next image
}
}
The problem is that with this setup, if you click the image, both nextImage()
and hideOverlay()
are called. But what I want is for only nextImage()
to be called.
I know you can capture and cancel the event in the nextImage()
function like this:
if (window.event) {
window.event.stopPropagation();
}
...But I want to know if there's a better AngularJS way of doing it that won't require me to prefix all of the functions on elements inside the overlay with this snippet.
Answer
What @JosephSilber said, or pass the $event object into ng-click
callback and stop the propagation inside of it:
$scope.nextImage = function($event) {
$event.stopPropagation();
// Some code to find and display the next image
}
php - file_get_contents shows unexpected output while reading a file
I want to output an inline jpg image as a base64 encoded string, however when I do this : $contents = file_get_contents($filename); print &q...
-
I have an app which needs a login and a registration with SQLite. I have the database and a user can login and register. But i would like th...
-
I got an error in my Java program. I think this happens because of the constructor is not intialized properly. My Base class Program public ...
-
I would like to use enhanced REP MOVSB (ERMSB) to get a high bandwidth for a custom memcpy . ERMSB was introduced with the Ivy Bridge micro...
No comments:
Post a Comment