web-dev-qa-db-fra.com

passer l'ID du bouton dans ng-click angular.js

J'ai besoin de passer l'ID du bouton dans Ionic Framework.

Voici ce que j'ai essayé.

En code js: 

angular.module('todo', ['ionic'])
.controller('TodoCtrl', function($scope) {
    {
        $scope.showAlert = function(btnId) {
            alert(btnId);
        };
    }
});

En html: 

<button id="a" class="button button-light"  data="{{button.id}}" ng-click="showAlert(data.id)">
    Click Me
</button>

O/P: undefined

ou

<button id="a" class="button button-light"  data="{{button.id}}" ng-click="showAlert(data)">
    Click Me
</button>

O/P: undefined

ou

<button id="a" class="button button-light"  data="{{event.id}}" ng-click="showAlert(data.id)">
    Click Me
</button>

O/P: undefined

ou

<button id="a" class="button button-light" ng-click="showAlert(this.id)">
    Click Me
</button>

O/P: undefined

ou

<button id="btnId" class="button button-light" ng-click="showAlert('btnId')">
    Click Me
</button>

O/P: btnId

Est-ce la bonne façon d'écrire directement l'id du bouton dans la fonction?

J'ai fait référence à quelques réponses comme this . Je pense donc que je fais une erreur en l'utilisant. Veuillez me faire savoir ce que je dois changer.

angularjsangularjs-ng-clickionic-framework
12
user2185272

Yo, vérifiez ce Gist:

https://Gist.github.com/lc-nyovchev/ed0a640a82a0f2dfd5a1

C'est une façon très simple et naïve de le faire.

<div data-ng-init="btnId='asd';">
    <button data-ng-attr-id="btnId" class="button button-light" data-ng-click="showAlert(btnId)">
        Click Me
    </button>
</div>

Ou vous pouvez avoir dans votre contrôleur:

$scope.btnId = 'asd';

Ensuite, vous n'avez pas besoin de la division de bloc ng-init.

Ou vous pouvez obtenir un handle vers l'événement $ dans votre ng-click, et obtenir sa cible, puis obtenir son identifiant, mais je ne le recommanderais pas, ce n'est pas la manière angular de faire les choses:

<button id="bla" class="button button-light" data-ng-click="showAlert($event)">
    Click Me
</button>


$scope.showAlert = function(event){
    alert(event.target.id);
}
41
Nikola Yovchev

Cela fonctionne si aucun répéteur n'est là, si les répéteurs sont l'attribut de données doit avoir des noms différents et deuxièmement event.CurrentTarget.Id le fera fonctionner.

3
Kushal M K