2012-09-28 9 views
68

Ho un semplice pulsante di cancellazione che accetta una stringa o un numero ma non accetta una variabile di modello ng (non sono sicuro che sia la terminologia corretta).Come si può passare una variabile vincolata ad una funzione ng-clic?

<button class="btn btn-danger" ng-click="delete('{{submission.id}}')">delete</button> 

che genera:

<button class="btn btn-danger" ng-click="delete('503a9742d6df30dd77000001')">delete</button> 

Tuttavia, non succede nulla quando si fa clic. Se faccio un codice fisso su una variabile, allora funziona bene. Suppongo che non sto solo facendo le cose nel modo "angolare", ma io non sono sicuro di quello che modo è :)

Ecco il mio codice di controllo:

$scope.delete = function (id) { 
    alert('delete ' + id); 
} 

risposta

131

Non è necessario utilizzare parentesi graffe ({{}}) nel ng-click, provate questo:

<button class="btn btn-danger" ng-click="delete(submission.id)">delete</button> 
+2

come faccio poi passare submission.id tramite una funzione? Da quello che capisco, la funzione (submission.id) {} ​​non funzionerebbe nel mio controller perché una funzione non può eccetto un punto –

+1

* Chiarimento * :: Non è necessario usare parentesi graffe quando si passano valori angolari agli attributi, ma ne avrai ancora bisogno nel codice HTML interno. Esempio: Rick

+0

Mi stavo chiedendo perché faceva passare le parentesi per funzionare invece del valore della variabile quando si fa questo: ' Dettagli 'La tua risposta ha davvero aiutato:' Dettagli ' La cosa divertente è che il modo sbagliato sembrava essere correttamente visualizzato nella finestra degli strumenti dello sviluppatore. – jaybro

1

la direttiva ngClick si lega un espressione. Esegue direttamente il codice angolare (come ngIf, ngChange, ecc.) Senza necessità di {{ }}.

angular.module('app', []).controller('MyCtrl', function($scope) { 
 
    $scope.submission = { id: 100 }; 
 

 
    $scope.delete = function(id) { 
 
     alert(id + " deleted!"); 
 
    } 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<div ng-app="app" ng-controller="MyCtrl"> 
 
    <button ng-click="delete(submission.id)">Delete</button> 
 
</div>

Problemi correlati