Trigger AngularJS $scope event on key press [duplicate]

Question

Is it possible to trigger a $scope function on keypress. I like to know whats the most comfortable way to handle key press in a "form case". I created a dummy plunker.

Controller

// Code goes here
var myApp = angular.module("myApp", []);

//main controller define
myApp.controller('MainCtrl', ['$scope', MainCtrl]);

/**
 * MainCtrl object wrapper
 */
function MainCtrl ($scope) {

  /**
   * Submit function
   */
  $scope.submit = function () {
    console.log('Submit was triggered');
  }
}

View

<!DOCTYPE html>
<html>
  <head>
    <script data-require="[email protected]" data-semver="1.3.15" src="https://code.angularjs.org/1.3.15/angular.js"></script>
    <link rel="stylesheet" href="style.css" />
    <script src="script.js"></script>
  </head>
  <body ng-app="myApp">
    <div ng-controller="MainCtrl">
      <input type="text" placeholder="Trigger on enter key" />
      <button ng-click="submit();">Trigger on click</button>
    </div>
  </body>
</html>

Will Smith · Accepted Answer · 2015-05-20 13:09:14Z

1

Try wrapping it in a form tag and using ng-submit

<form ng-submit="submit()">
    <input type="text" placeholder="Trigger on enter key" />
    <button>Trigger on click</button>
</form>

answered May 20, 2015 at 13:09

Will Smith

1,9351 gold badge14 silver badges19 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Trigger AngularJS $scope event on key press [duplicate]

Controller

View

1 Answer 1

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

Controller

View

1 Answer 1

Comments

Linked

Related