Angularjs ng-click: comment obtenir ces données?
disons que j'ai cet article dans la liste avec angular ng-click événement.
<a data-id='102' ng-click='delete()'>Delete</a>
Comment puis-je obtenir les données/ informations si this alors?
$scope.delete = function() {
var id = $(this).attr('data-id');
console.log(id); // I want to get 102 as the result
if (confirm('Are you sure to delete?')) {
$('#contactsGrid tr[data-id="' + id + '"]').hide('slow');
}
};
4 réponses
La bonne solution est de passer l'id en paramètre à la fonction de suppression
<a data-id='102' ng-click='delete(102)'>Delete</a>
$scope.delete = function(id) {
console.log(id); // I want to get 102 as the result
if (confirm('Are you sure to delete?')) {
$('#contactsGrid tr[data-id="' + id + '"]').hide('slow');
}
};
Cela ne devrait pas être fait, mais simplement pour démontrer
à l'Intérieur ng-click vous pouvez obtenir l'événement en utilisant $event, donc
<a data-id='102' ng-click='delete($event)'>Delete</a>
$scope.delete = function (e) {
var id = $(e.target).data('id');
console.log(id); // I want to get 102 as the result
};
Démo: Tripoter
pour accéder aux attributs de la balise de lien cliqué
jQuery,
<a class='test' data-id='102' ng-click='delete(102)'>Delete</a>
sur le clic du lien ci-dessus est traitée comme
$('.test').click(function(){
console.log($(this).attr('data-id'));
});
Démo de code jQuery : tripoter
Angularjs,
<a class='test' data-id='102' ng-click='delete($event)'>Delete</a>
sur le clic du lien ci-dessus est traitée comme
$scope.delete = function (e) {
console.log($(e.currentTarget).attr("data-id"));
}
le code de Démonstration pour Angularjs : tripoter
vous pouvez également accéder aux données d'événements pour Jquery en angle en utilisant:
$scope.myClickedEvent = function(clickEvent) {
$scope.clickEvent = simpleKeys(clickEvent);
angular.element(clickEvent.currentTarget);
console.log(angular.element(clickEvent.currentTarget).text());
/*
* return a copy of an object with only non-object keys
* we need this to avoid circular references
*/
function simpleKeys (original) {
return Object.keys(original).reduce(function (obj, key) {
obj[key] = typeof original[key] === 'object' ? '{ ... }' : original[key];
return obj;
}, {});
}
};
votre élément cliqué doit contenir un ng-click comme ceci
ng-click="myClickedEvent($event)"
Si, pour quelque autre raison, vous avez encore besoin d'accéder à l'élément voici comment j'ai fait :
<span ng-click="selectText($event)"></span>
et dans le contrôleur
$scope.selectText = function(event) {
var element = event.currentTarget; // returns the span DOM Element
// Now you can access its dataset just like in plain old JS
// In my case it was for selecting the content of a tag on click anywhere on the tag
};