href prévaut sur ng-click dans Angular.js

Question

Lorsque les deux attributs, href et ng-click, sont définis :

<a href="#" ng-click="logout()">Sign out</a>

le site href a la priorité sur l'attribut ng-click.

Je cherche un moyen d'augmenter la priorité de ng-click.

href est nécessaire pour Twitter Bootstrap, je ne peux pas le supprimer.

Answer 1

Cet exemple tiré du site de documentation d'Angular le fait simplement href sans même l'affecter à une chaîne vide :

[<a href ng-click="colors.splice($index, 1)">X</a>]

http://docs.angularjs.org/api/ng.directive:select

Answer 2

Vous pouvez simplement empêcher le comportement par défaut de l'événement de clic directement dans votre modèle.

<a href="#" ng-click="$event.preventDefault();logout()" />

Par le documentation angulaire ,

Les directives comme ngClick et ngFocus exposent un objet $event dans la portée de cette expression.

Answer 3

Voici une autre solution :

<a href="" ng-click="logout()">Sign out</a>

Par exemple, il suffit de supprimer le # de l'attribut href.

Answer 4

Vous devriez probablement utiliser une balise de bouton si vous n'avez pas besoin d'un uri.

Answer 5

Encore un indice. Si vous avez besoin d'une véritable URL (pour favoriser l'accessibilité du navigateur), vous pouvez procéder comme suit :

modèle :

<a ng-href="{{link}}" ng-click="$event.preventDefault(); linkClicked(link)">{{link}}</a>

directive :

$scope.linkClicked = function(link){
    // your code here
    $location.path(link);
};

De cette façon, votre code dans linkClicked() aura la possibilité de s'exécuter avant de naviguer vers le lien.