Bootstrap 3 - Como desvanecer a caixa de alerta ao clicar e desvanecer após 3 segundos
Estou usando o AngularJS e o Bootstrap 3. Meu aplicativo da web possui um botão "Atualizar", onde ele salva as alterações feitas pelo usuário. Quando o usuário clica no botão "Atualizar", desejo ativar e desvanecer a caixa de alerta do bootstrap dizendo "As informações foram salvas" e desvanecer após 3 segundos. Não sei como criar essa função e pode precisar de ajuda ..
ATUALIZAR:
Eu decidi usar esta abordagem:
HTML
<button type="button" class="btn btn-info" ng-click="save()">Update</button>
<div id = "alert_placeholder"></div>
Javascript
$scope.save = function() {
$('#alert_placeholder').html('<div class="alert alert-warning alert-dismissable"><button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button><span>Your information has been updated.</span></div>')
setTimeout(function() {
$("div.alert").remove();
}, 3000);
}
Gostaria de fazer com que a caixa de alerta desapareça quando for exibida e desapareça quando for removida após 3 segundos, mas não sei como fazê-la funcionar com o código que tenho.