user791134 user791134 - 4 months ago 5x
AngularJS Question

Issues with getting $timeout function to work

I have created a plunkr with my code that does work. After the drop down is collapsed by clicking the Toggle collapse button, I need the dropdown to close on it's own after 3 seconds. I have played with the following in the HeaderCtrl in example.js with no luck:

function callAtTimeout(){
$scope.isFooCollapsed = true;

}, 3000);

Any help/input would be appreciated. Thanks in advance!


You can just use angular $timeout to achieve the wanted like this:

var timer;
$scope.isFooCollapsed = true;
$rootScope.$on("bagNotification", function() {
  $scope.isFooCollapsed = !$scope.isFooCollapsed;
  timer = $timeout(function() {
    $scope.isFooCollapsed = true;
  }, 3000);

We cancel the timeout each time with $timeout.cancel to prevent multiple hide/shows when button is clicked multiple times.