AngularJS Bootstrap alert dismiss-on-timeout attribute doesn't work

Question

I'm trying to use AngularJS Bootstrap alerts like explained here with the "dismiss-on-timeout" attribute. It has no effect in this example, the alert just appears regularly and doesn't disappear.

<alert type="warning" dismiss-on-timeout="2000">Alert text</alert>

It does however work in the ng-repeat example from the site:

<alert ng-repeat="alert in alerts" type="{{alert.type}}" close="closeAlert($index)" dismiss-on-timeout="2000">{{alert.msg}}</alert>

Is the problem the missing close attribute? If so, how do you write a close function for an alert that's not part of an array?

Answer 1

Well it works, it's just dismissOnTimeout directive invokes close method of the alert directive controller. This controller in its turn uses outer scope close method. So you need to implement it with so that directive could call it:

<alert type="danger" close="closeAlert()" ng-if="show" 
       dismiss-on-timeout="2000">Something happened.</alert>

and in controller:

$scope.show = true;

$scope.closeAlert = function(index) {
    $scope.show = false;
};