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?
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);
};
}
]);
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With