jQuery key event with angular

Question

I have a jquery key event listener which looks for the Ctrl+C event. My problem is commented below.

jQuery(window).on('keydown', function(e){

    if(e.ctrlKey && e.which == '67')
    {
        // console.log('pressed'); This works
        // $scope.closeShareBar(); This works
        $scope.showNotif('The URL has been copied to your clipboard', null, true); // This DOES NOT work
    }

});

$scope.showNotif('The URL has been copied to your clipboard', null, true); // This works

Why is it not working? $scope.showNotif() is a function I have written to show notifications.

edit
I hope i have made it clear that $scope.closeShareBar(); works without $apply(). Why does only this work then? Isn't this angular too?

edit 2

$scope.showNotif = function(text, status, closeEnabled, quick){
    $scope.notif_text = text;
    $scope.notif = status || 'show';
    if (closeEnabled == true)
    {
        $timeout.cancel($scope.timer);
        $scope.timer = $timeout(function(){
            $scope.notif = '';
        }, 3000);
    }
    if (quick == true)
    {
        $scope.notif = '';
    }
}

$scope.closeShareBar = function(){

    // $scope.shareLink = 'http://localhost:3000/single-signal/'+id;
    angular.element(document.querySelectorAll('.signal_wrapper .signal_data')).removeClass('share_overlay');
    angular.element(document.querySelectorAll('.signal_wrapper .sb_status .share')).removeClass('hide');
    angular.element(document.querySelectorAll('.signal_wrapper .sb_status .close')).addClass('hide');

}

You may have to do $scope.$apply() if you are looking for some scope binding updates that happens inside showNotif. — PSL, Jan 13 '15 at 16:50
You do need scope.apply only when you update scope property that are bound to the view. Without seeing what `showNotif` does it is hard to help. — PSL, Jan 13 '15 at 16:59
As i commented earlier you have properties that are bound to the view which gets updated in the function, so you need scope.apply inside the jquery event handler. and `closeShareBar` works because you are directly manipulating DOM — PSL, Jan 13 '15 at 17:02

score 0 · Answer 1 · answered Jan 13 '15 at 16:52

0

Anytime you do something outside of angular, you need to notify it that you've done a change. So right after your $scope.showNotif you'll need to do a $scope.$apply();

$scope.showNotif(...);
$scope.$apply();

answered Jan 13 '15 at 16:52

Mathew Berg

28,625
11
69
90

jQuery key event with angular

1 Answers1