2013-04-18 12 views
6

Chcę wywołać zdarzenie kliknięcia przycisku po naciśnięciu klawisza ENTER wewnątrz danych wejściowych, co jest dość trudne w przypadku AngularJS.Kliknij przycisk "Ogień" w AngularJS

Mój pogląd (uproszczony, aktualizowane):

<!doctype html> 
<html lang="en" ng:app="test"> 
    <head> 
     <meta charset="utf-8" /> 
     <title>Test</title> 
     <link rel="stylesheet" href="css/app.css" /> 
    </head> 
    <body ng-controller="TestController"> 
     <button ng-click="onButton1Click()" class="btn1">Click Me</button> 
     <button ng-click="onButton2Click()" class="btn2">Don't click me</button> 
     <script src="lib/jquery/jquery.js"></script> 
     <script src="lib/angular/angular.js"></script> 
     <script src="js/testcontroller.js"></script> 
    </body> 
</html> 

Mój kontroler dla tego widoku:

'use strict'; 

angular.module('test', []) 
.controller('TestController', ['$scope', 
    function($scope) { 

     $scope.onButton1Click = function() { 
      alert("Hello"); 
     } 

     $scope.onButton2Click = function() { 
      $('.btn2').click(); 
     } 
}]) 

I uprościć cały kod do tego. Gdy klikam na btn2 otrzymuję ten błąd

$ zastosować już w toku

Nie, nie mogę nazwać $scope.onButton1Click() bezpośrednio muszę symulować btn1 kliknięcie.

+0

to aplikacja: click-watch = "onButtonClick()" napisałeś własną dyrektywę? – ganaraj

+0

Tak, to jest dyrektywa niestandardowa – ali

+0

czy możesz umieścić swój kod w plunker? – ganaraj

Odpowiedz

3

Zajęło mi to trochę czasu, zanim się zorientowałem (dużo skrzypiec).

<form id="nowsorting" ng-submit="getData(sc_user)">Now sorting the Soundcloud likes of <input type="text" ng-model="sc_user"><input type="submit" value="Sort"></form>

Zrób forma i zastosowanie ng przesłać do ognia zdarzenie (prawdopodobnie funkcji).

Następnie utwórz dwa wejścia (jeden to "tekst", a drugi "prześlij").

Następnie naciśnięcie enter powinno wywołać funkcję/funkcję ng-submit.

1

myślę, wystarczy zadzwonić do $ scope.onButtonClick()

Proszę sprawdzić this Plunker

$scope.onKeyPress = function($event) { 
    if ($event.keyCode == 13) { 
     $scope.onButtonClick(); 
    } 
}; 
+1

To naprawdę nie "klika" przycisku, po prostu wykonuje ten sam kod javascript, który jest podłączony do kliknięcia przycisku.Jest nieco inny, ponieważ każdy dodatkowy słuchacz, który kliknął ten przycisk, nie zostanie uruchomiony. – Randyaa

13

Wspomniałeś

pożar zdarzenia kliknięcia jednego przycisku, gdy naciskając klawisz ENTER wewnątrz wejście

Więc jeśli to sa Załóżmy, że możesz mieć formularz, który wolałbym używać: , jak pokazano poniżej.

<form ng-submit="clickEventFunction()"> 
    <input type="text"/> 
    <button type="submit">Click</button> 
</form> 

Uwaga typ przycisk powinien być złożyć.

+0

to jest poprawna odpowiedź – JT703

Powiązane problemy