href remplace ng-click dans Angular.js

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

Sign out 

l’atsortingbut href est prioritaire sur ng-click.

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

href est requirejs pour Twitter Bootstrap, je ne peux pas le supprimer.

Vous devriez probablement utiliser un bouton si vous n’avez pas besoin d’URI.

Cet exemple du site de documentation angular ne fait que href sans même l’affecter à une chaîne vide:

 [X] 

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

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

  

Par la documentation angular ,

Des directives telles que ngClick et ngFocus exposent un object $ event dans la scope de cette expression.

Voici une autre solution:

 Sign out 

C’est-à-dire simplement supprimer le # de l’atsortingbut href

Juste un indice supplémentaire. Si vous avez besoin d’une véritable URL (pour prendre en charge l’accessibilité du navigateur), vous pouvez procéder comme suit:

modèle:

 {{link}} 

directif:

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

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

En angular, s sont des directives . En tant que tel, si vous avez un href vide ou aucun href , Angular appellera event.preventDefault .

De la source :

  element.on('click', function(event){ // if we have no href url, then don't navigate anywhere. if (!element.attr(href)) { event.preventDefault(); } }); 

Voici un plnkr démontrant le scénario href manquant.

Cela a fonctionné pour moi dans IE 9 et AngularJS v1.0.7:

 Logout 

Merci au commentaire de duckeggs pour la solution de travail!

Il suffit d’écrire ng-click avant href ..Il a fonctionné pour moi

 < !DOCTYPE html>       

Hello ..

Take me there

Il y a tellement de réponses à cette question ici, mais il semble y avoir un peu de confusion sur ce qui se passe réellement ici.

Tout d’abord, votre prémisse

“href remplace ng-click dans Angular.js”

est faux. Ce qui se passe en fait, c’est qu’après votre clic, l’événement de clic est d’abord traité par angular (défini par la directive ng-click en angular 1.x et click sur angular 2.x +) puis continue à se propager (ce qui déclenche finalement le navigateur) pour accéder à l’url défini avec l’atsortingbut href ) (voir ceci pour plus d’informations sur la propagation des événements en javascript)

Si vous souhaitez éviter cela, vous devez annuler la propagation de l’événement à l’aide de la méthode preventDefault() l’interface The Event :

  

(Ceci est pur fonctionnalité javascript et rien à voir avec angular)

Cela résoudra déjà votre problème, mais ce n’est pas la solution optimale. Angular, à juste titre, favorise le modèle MVC . Avec cette solution, votre modèle HTML est mélangé avec la logique javascript. Vous devriez essayer d’éviter cela autant que possible et mettre votre logique dans votre contrôleur angular. Donc, une meilleure façon serait

  

Et dans votre méthode de déconnexion ():

 logout($event) { $event.preventDefault(); ... } 

Maintenant, l’événement click n’atteindra pas le navigateur, il ne tentera donc pas de charger le lien pointé par href . (Notez cependant que si l’utilisateur clique avec le bouton droit sur le lien et ouvre directement le lien, il n’y aura aucun événement de clic. Au lieu de cela, il chargera directement l’URL pointée par l’atsortingbut href .)

En ce qui concerne les commentaires sur la couleur des liens visités dans les navigateurs. Encore une fois, cela n’a rien à voir avec angular, si votre href="..." pointe vers une URL visitée par votre navigateur par défaut, la couleur du lien sera différente. Ceci est contrôlé par CSS: sélecteur visité , vous pouvez modifier votre css pour remplacer ce comportement:

 a { color:pink; } 

PS1 :

Certaines réponses suggèrent d’utiliser:

  

href est une directive angular. Lorsque votre modèle est traité par angular, celui-ci sera converti en

  

Ces deux manières sont essentiellement les mêmes.

Je ne pense pas que vous devez supprimer “#” de href. Travaux suivants avec Angularjs 1.2.10

 Logout 

Vous pouvez également essayer ceci:

 

Tutorials

Go to {{myVar}} to learn!

Je vais append pour vous un exemple qui fonctionne pour moi et vous pouvez le changer comme vous le souhaitez.

J’ajoute le code ci-dessous à l’intérieur de mon contrôleur.

  $scope.showNumberFct = function(){ alert("Work!!!!"); } 

et pour ma page de visualisation j’ajoute le code ci-dessous.

 Click Me!!! 

Avez-vous essayé de redirect à l’intérieur de la fonction de déconnexion elle-même? Par exemple, disons que votre fonction de déconnexion est la suivante

 $scope.logout = function() { $scope.userSession = undefined; window.location = "http://www.yoursite.com/#" } 

Alors vous pouvez juste avoir

 Sign out 

S’il te plaît, vérifie cela

 Logout $scope.logout = function(event) { event.preventDefault(); alert("working.."); } 
 //for dynamic elements - if you want it in ng-repeat do below code angular.forEach($scope.data, function(value, key) { //add new value to object value.new_url = "your url"; });