Note: Let me start by saying that I'm aware of this question but the solution is incomplete and I don't yet have not enough reputation on stackoverflow to comment on it. So, I was left with the only option of creating a duplicate question.
I'm trying to use angularjs and bootstrap (ui-bootstrap) to show a dismissible alert. However, even after including ui-bootstrap-tpls-*.js file (solution suggested on original question) it doesn't seem to work. Although it does work with jquery.
Please check this plunker
I found a way to have a dismissible alert without adding extra logic to the controller. I don't even need bootstrap-*-js.
Basically I have an alert with a close button that uses
ng-click on a
$scope variable to hide the parent div on
ng-show. (The controller sets that variable to whether that alert should be initially shown or not.)
<div class="alert alert-warning" ng-show="show_alert"> <button type="button" class="close" ng-click="show_alert=false">×</button> <strong>Warning!</strong> Best check yo self, you're not looking too good. </div>
The css classes
alert alert-warning and
close are styled by bootstrap.
Check out this plunker with the above solution.