Angular to close modal key with key

I created an Angular directive that should close the modality when the start key is pressed. A modal service works fine when used in controllers, but for some reason it does not work under this directive. The following code will print hellowhen escape is pressed, but it will not hide the modal. Any ideas?

DIRECTIVE

app.directive("dpEscape", function(modal) {
  return function(scope, element, attributes) {
    element.on("keyup", function(event) {
      if (event.keyCode == 27) {
        console.log("hello");
        modal.hide();
      }
    });
  };
});

I really don't think any of the following codes is relevant to the problem, but I could be wrong. Since I know that people are going to ask for all this, here it is:

HTML

...
<html ng-app="trread" ng-controller="Main" dp-escape>
...

SERVICE

app.factory("modal", function() {

  var urlPath = "/templates/modals/";
  var visible = false;
  var templateUrl = "";
  var content = {};
  var controller = {};
  var size = {width: 500, height: 500};

  var show = function() {
    visible = true;
  }

  var hide = function() {
    visible = false;
  }

  var setTemplate = function(url) {
    templateUrl = urlPath + url + ".html";
  }

  var getTemplate = function() {
    return templateUrl;
  }

  var setContent = function(contentObj) {
    content = contentObj;
  }

  var getContent = function() {
    return content;
  }

  var setController = function(controllerObj) {
    controller = controllerObj;
  }

  var getController = function() {
    return controller;
  }

  var isVisible = function() {
    return visible;
  }

  return {
    show: show,
    hide: hide,
    setTemplate: setTemplate,
    getTemplate: getTemplate,
    setContent: setContent,
    getContent: getContent,
    setController: setController,
    getController: getController,
    isVisible: isVisible,
  };

});
+3
source share
1 answer

click, keydown .. Angular, . $scope , Angular, - . $apply. $apply Angular context Angular .

+5

All Articles