Joao Joao - 6 months ago 11
AngularJS Question

Why is the dismissible alert not being dismissed?

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

Answer

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">&times;</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.

Comments