2013-08-28 11 views
14

używam ng-repeat w szablonie dotyczący dyrektywy niestandardowego następująco:Przekazywanie parametru na ng kliknij dyrektywy, w ciągu dyrektywy niestandardowego

<li ng-repeat="image in images"> 
    <img ng-src="{{image.url}}" ng-click="togglePhoto({{$index}})"> 
</li> 

Kiedy wydanego na stronie źródłem wygląda

<li ng-repeat="image in images" class="ng-scope"> 
    <img ng-src="http://example.com/example.jpg" ng-click="togglePhoto(1)" src="http://example.com/example.jpg"> 
</li> 

Mam funkcję togglePhoto zdefiniowaną w mojej dyrektywie. Bez podania parametru {{index}} zadziała i zostanie wywołana funkcja. Z indeksem nie uruchamia się.

Jak uzyskać indeks zdjęcia klikniętego w funkcję togglePhoto?

+0

Jak zdefiniowano 'togglePhoto (x)'? – zsong

Odpowiedz

37

Wyobraziłem to. Mam nadzieję, że pomoże to każdemu, kto się na tym utknął.

Po pierwsze to

ng-click="togglePhoto({{$index}})" 

Powinny być

ng-click="togglePhoto($index)" 

Szelki nie są potrzebne!

Po drugie uważam, że można przekazać obiekt zdarzenia do funkcji kliknięcia np

ng-click="togglePhoto($event)" 

Następnie złapać tego zdarzenia i dowiedzieć się, co elementem trigged go w funkcji click

$scope.togglePhoto = function(e) 
{ 
    console.log(e.currentTarget) 
} 
1

myślę Problem polega na tym, że używasz podwójnych nawiasów klamrowych wewnątrz ng-kliknięcia, a kątowe to nie podoba.

Spróbuj zmienić repeater to (uwaga nie występują nawiasy klamrowe około $ indeksu):

<li ng-repeat="image in images"> 
    <img ng-src="{{image.url}}" ng-click="togglePhoto($index)"> 
</li> 

ja również ułożyła jsfiddle roboczą, aby pokazać, że to działa.

http://jsfiddle.net/n02ms8s0/4/

Powiązane problemy