web-dev-qa-db-fra.com

Passer une référence à un objet DOM avec ng-click

J'ai plusieurs éléments avec le même rappel sur ng-click:

<button ng-click="doSomething()"></button>
<button ng-click="doSomething()"></button>
<button ng-click="doSomething()"></button>
<button ng-click="doSomething()"></button>

// In controller:
$scope.doSomething = function() {
  // How do I get a reference to the button that triggered the function?
};

Comment puis-je obtenir la référence à l'objet qui a appelé à faire quelque chose? (J'ai besoin d'enlever un attr)

angularjsangularjs-ng-click
64
jviotti

La manière angular est indiquée dans la documentation angular :)

https://docs.angularjs.org/api/ng/directive/ngReadonly

Voici l'exemple qu'ils utilisent:

<body>
    Check me to make text readonly: <input type="checkbox" ng-model="checked"><br/>
    <input type="text" ng-readonly="checked" value="I'm Angular"/>
</body>

Fondamentalement, la méthode angular consiste à créer un objet de modèle qui déterminera si l'entrée doit être en lecture seule ou non, puis définira cet objet de modèle en conséquence. La beauté de angular est que la plupart du temps, vous n'avez pas besoin de manipuler le dom. Vous avez juste angular rendu la vue telle que définie par votre modèle (laissez angular manipuler le dom pour vous et gardez votre code propre).

Donc, dans votre cas, vous voudriez faire quelque chose comme ci-dessous ou consulter this exemple de travail.

<button ng-click="isInput1ReadOnly = !isInput1ReadOnly">Click Me</button>
<input type="text" ng-readonly="isInput1ReadOnly" value="Angular Rules!"/>
20
testing123

Pendant que vous faites les choses suivantes, techniquement parlant:

<button ng-click="doSomething($event)"></button>

// In controller:
$scope.doSomething = function($event) {
  //reference to the button that triggered the function:
  $event.target
};

C’est probablement quelque chose que vous voulez ne pas, car la philosophie d’AngularJS consiste à se concentrer sur la manipulation du modèle et à laisser AngularJS se charger du rendu (sur la base d’allusions fournies par l’interface utilisateur déclarative). La manipulation d'éléments et d'attributs DOM à partir d'un contrôleur est un gros no-no dans le monde AngularJS.

Vous pouvez vérifier cette réponse pour plus d'informations: https://stackoverflow.com/a/12431211/1418796

213
pkozlowski.opensource