I've created an Angular directive that is supposed to close a modal when the escape key is pressed. The modal service works just fine when used within controllers, but for some reason it doesn't work within this directive. The following code will print hello
when 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 don't actually think any of the following code is relevant to the problem, but I could be wrong. Since I know people are going to ask for it anyways, 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,
};
});