jQuery key event with angular [duplicate]

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
– PSL, Commented Jan 13, 2015 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
– PSL, Commented Jan 13, 2015 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
– PSL, Commented Jan 13, 2015 at 17:02

Mathew Berg · Accepted Answer · 2015-01-13 16:52:01Z

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, 2015 at 16:52

Mathew Berg

28.8k11 gold badges72 silver badges94 bronze badges

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

Collectives™ on Stack Overflow

jQuery key event with angular [duplicate]

1 Answer 1

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Linked

Related