Angular.ui alert doesn't close

Question

I'm use the Angular-ui and i want to create single alert. But Alert won't to close

<div ng-controller="AlertCtrl">

     <alert type="danger" close>i'm alert</alert>

</div>

Answer 1

actually you don't even need a controller and a function if you place your message in the html:

<alert type="danger" close="bCloseAlert=1" ng-hide="bCloseAlert">i'm alert</alert>

Answer 2

If you only ever want to show one alert, you need to change your approach a little.

Your should pass a function from your AlertCtrl's scope to the "close" attribute, like this:

<alert type="{{alert.type}}" close="closeAlert()" ng-show="alert != null">
    {{alert.msg}}
</alert>

Note that your type, and the text of the alert, now reference an alert object. Also note that I have added the ng-show attribute to only show the alert markup if the alert object is not null.

And then implement that function in your controller, and define an alert object for it to manipulate:

$scope.alert = { type: 'danger', msg: 'im alert' };

$scope.closeAlert = function() {
    $scope.alert = null;
}