Timeout to clear flash message in Angularjs? - angularjs

Question

I am trying to give timeout to clear my FlashService message. But it works as delay time.
FlashService.Success(("Removed Successfully"), false);
In this I am using false as condition. It means when page or location changed flash message gets cleared.
My flash.service.js
function clearFlashMessage() {
var flash = $rootScope.flash;
if (flash) {
if (!flash.keepAfterLocationChange) {
delete $rootScope.flash;
} else {
// only keep for a single location change
flash.keepAfterLocationChange = false;
}
}
}
}
function Success(message, keepAfterLocationChange) {
$rootScope.flash = {
message: message,
type: 'success',
keepAfterLocationChange: keepAfterLocationChange
};
}
function Error(message, keepAfterLocationChange) {
$rootScope.flash = {
message: message,
type: 'error',
keepAfterLocationChange: keepAfterLocationChange
};
}
In my above js I am clearing the flash message with flag as "false" when page or location changed.
I need to set the timeout in that false condition. That is if flag is false then flash message need to be cleared within some time period.

Answer 1

You need to call the function to clear the message after 2 sec - instead of doing $timeout(fn, interval).
i.e.
FlashService.Success(("Removed Successfully"), false);
$timeout(function(){
//clear message
//FlashService.ClearMessage(); - or whatever how you clear the message
}, 2000);

Answer 2

You need delete $rootScope.flash after delay. The simpliest way is to start another function called in functions Error and Success. Don't forget to inject $timeout :)
(function () {
'use strict';
angular
.module('app')
.factory('FlashService', FlashService);
FlashService.$inject = ['$rootScope', '$timeout'];
function FlashService($rootScope, $timeout) {
var service = {};
service.Success = Success;
service.Error = Error;
initService();
return service;
function initService() {
$rootScope.$on('$locationChangeStart', function () {
clearFlashMessage();
});
function clearFlashMessage() {
var flash = $rootScope.flash;
if (flash) {
if (!flash.keepAfterLocationChange) {
delete $rootScope.flash;
} else {
// only keep for a single location change
flash.keepAfterLocationChange = false;
}
}
}
}
function clearFlashMessageT() {
console.log("clear after 2 sec started")
$timeout(function(){
delete $rootScope.flash;
}, 2000);
}
function Success(message, keepAfterLocationChange) {
$rootScope.flash = {
message: message,
type: 'success',
keepAfterLocationChange: keepAfterLocationChange
};
clearFlashMessageT()
}
function Error(message, keepAfterLocationChange) {
$rootScope.flash = {
message: message,
type: 'error',
keepAfterLocationChange: keepAfterLocationChange
};
clearFlashMessageT()
}
}
})();