Oto przykład. Powiedzmy, że chcę mieć nakładkę graficzną podobną do wielu witryn. Tak więc po kliknięciu miniatury na całym oknie pojawia się czarna nakładka, w której jest umieszczona większa wersja obrazu. Kliknięcie czarnej nakładki powoduje jej oddalenie; kliknięcie obrazu wywoła funkcję, która pokazuje następny obraz.
HTML:
<div ng-controller="OverlayCtrl" class="overlay" ng-click="hideOverlay()">
<img src="http://some_src" ng-click="nextImage()"/>
</div>
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
}
}
Problemem jest to, że przy tej konfiguracji, jeśli klikniesz obraz, zarówno nextImage()
i hideOverlay()
są nazywane. Ale chcę tylko nextImage()
zostać powołany.
Wiem, że możesz przechwytywać i anulować zdarzenie w następującej nextImage()
funkcji:
if (window.event) {
window.event.stopPropagation();
}
... Ale chcę wiedzieć, czy jest lepszy sposób AngularJS, który nie wymaga ode mnie prefiksu wszystkich funkcji w elementach nakładki za pomocą tego fragmentu.
onclick
, nie ng-click
.
return false
na końcu funkcji