TypeError: $timeout is not a function

Question

What is happening here:

I want the "cancel reservation" button to have a timeout on it after its clicked. On first click it changes to show "confirm cancellation" button. After a few seconds it return back to "cancel reservation".

My console gives me:

TypeError: $timeout is not a function

I am using AngularJS $timeout:

controller:

'use strict';

module.controller('ReservationItemCtrl', ['$scope', '$stateParams', '$RPC',
    function($scope, $stateParams, $RPC, $timeout) {


 ......other stuff.......
 ......other stuff.......

    $scope.toggleCancelReservation = function(reservation) {
        reservation.clickedcancel = true;
        $timeout(function(){reservation.clickedcancel = false}, 4000);
    };
}
]);

template:

  <button ng-show="!reservation.value.deleted && !deleted.value"
          class="btn btn-danger" 
          ng-show="canCancel(reservation)" ng-if="!reservation.clickedcancel" ng-click="toggleCancelReservation(reservation)">
    Cancel With Refund
  </button>
  <button type="button" class="btn btn-danger" ng-if="reservation.clickedcancel == true" ng-click="deleteReservation();" style="margin-top: -4px;">
    Confirm Cancellation
  </button>

I am accurately getting the button to switch when first clicked and then if clicked again it correctly cancels/deletes the reservation but if I don't do anything after the first click the timeout never returns it back to the original button. In my console I see that $timeout is not a function for some reason? I have it included in my controller. Am I missing something?

Did you tried to fix the problem by adding '$timeout' in the list of injected services in the controller? — S.Klechkovski
– S.Klechkovski, Commented Sep 8, 2015 at 21:56

taxicala · Accepted Answer · 2015-09-08 21:55:55Z

8

You forgot the inline notation of $timeout:

'use strict';
module.controller('ReservationItemCtrl', ['$scope', '$stateParams', '$RPC', '$timeout',
    function ($scope, $stateParams, $RPC, $timeout) {
            ......other stuff.......
            ......other stuff.......
        $scope.toggleCancelReservation = function (reservation) {
            reservation.clickedcancel = true;
            $timeout(function () {
                reservation.clickedcancel = false
            }, 4000);
        };
    }
]);

answered Sep 8, 2015 at 21:55

taxicala

21.8k7 gold badges41 silver badges67 bronze badges

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

Comments

taxicala · Accepted Answer · 2015-09-08 21:58:56Z

2

You have to include $timeout in the controller dependencies

'use strict';

 module.controller('ReservationItemCtrl', ['$scope', '$stateParams', '$RPC','$timeout',
  function($scope, $stateParams, $RPC, $timeout) {

edited Sep 8, 2015 at 21:58

taxicala

21.8k7 gold badges41 silver badges67 bronze badges

answered Sep 8, 2015 at 21:57

Alvaro Silvino

9,83314 gold badges56 silver badges81 bronze badges

Collectives™ on Stack Overflow

TypeError: $timeout is not a function

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related