CODEWITHSUNDEEP
angularjstwitter-bootstrap
user3071183
user3071183

Reputation: 3

Angular JS - Not setting class for bootstrap 3

Following code is not working. It is supposed to show error or warning alert. Am I doing it correct?

<div ng-controller="HeaderController">
    <div ng-class='{alert-danger:show, warning:isWarning}' class="alert" ng-show="show">{{messageText}}</div>
    <button ng-click='showError()'>Simulate Error</button>
    <button ng-click='showWarning()'>Simulate Warning</button>
</div>

</div>

and 

<script>

    var HeaderController = function ($scope) {
        $scope.isError = false;
        $scope.isWarning = false;
        $scope.show = false;

        $scope.showError = function () {
            $scope.messageText = 'This is an error!';
            $scope.isError = true;
            $scope.isWarning = false;
            $scope.show = true;
        };

    }
</script>

Upvotes: 0

Views: 372

Answers (1)

D.Evangelista
D.Evangelista

Reputation: 6543

You should wrap the class, in ng-class with a single quotes:

<div ng-class="{'alert-danger':show, 'warning':isWarning}" class="alert" ng-show="show">{{messageText}}</div>

It was "documented" on a comment in the ng-class docs, but they removed the discuss from there.

Upvotes: 1

Related Questions