There seems to be an incompatibility problem either with `ngAnimate` or `toaster` with version of angular you are using.

If you rollback angular to version `1.2.12` the errors disappear.

I would check for more current versions of both, or check github issue tracker for toaster 

**Update:** realized after I wrote this that `ngAnimate` being used is a much lower version than angular core.

<kbd>**[DEMO][1]**</kbd>

   [1]: http://plnkr.co/edit/SZTQyX958OlHNMjhS1VF?p=preview

I'm getting a weird conflict when using `ng-class` with either of the ternary operators:



    <div ng-class="{'red': showDebug, 'blue': !showDebug}" >{{showDebug}}</div>
    <div ng-class="showDebug ? 'red' : 'blue'" >{{showDebug}}</div>

Whereas both of these work fine on their own:



    <div ng-class="{'red': showDebug}" >{{showDebug}}</div>
    <div ng-class="{'blue': !showDebug}" >{{showDebug}}</div>

I get the following error message:



    TypeError: undefined is not a function
    at updateClasses (https://code.angularjs.org/1.2.20/angular.js:18307:22)
    at Object.ngClassWatchAction [as fn] (https://code.angularjs.org/1.2.20/angular.js:18318:15)
    at Scope.$get.Scope.$digest (https://code.angularjs.org/1.2.20/angular.js:12447:29)
    at Scope.$get.Scope.$apply (https://code.angularjs.org/1.2.20/angular.js:12712:24)
    at HTMLAnchorElement.<anonymous> (https://code.angularjs.org/1.2.20/angular.js:18980:21)
    at https://code.angularjs.org/1.2.20/angular.js:2823:10
    at Array.forEach (native)
    at forEach (https://code.angularjs.org/1.2.20/angular.js:325:11)
    at HTMLAnchorElement.eventHandler (https://code.angularjs.org/1.2.20/angular.js:2822:5) angular.js:9997

[**Demo in Plunker**][plunker]  
<sup>Click on the Debug link.  The debug statements above it should change color</sup>

Oddly, this appears related to how I've initialized my module and controller.  I'm using both [ui.bootstrap][ui.bootstrap] and [toaster][toaster]

**This will work, but won't bring in toaster**:



    var app = angular.module('plunker', ['ui.bootstrap']);
    app.controller('MainCtrl', function($scope) {
      $scope.showDebug = true;
    });


**This doesn't work**:



    var app = angular.module('plunker', ['ui.bootstrap', 'toaster']);
    app.controller('MainCtrl', function($scope, toaster) {
      $scope.showDebug = true;
    });

**I've also tried to inject toaster straight into the controller itself, but still doesn't resolve any conflicts**:



    var app = angular.module('plunker', ['ui.bootstrap', 'toaster']);
    app.controller('MainCtrl', ['$scope', 'toaster', function($scope, toaster) {
      $scope.showDebug = true;
    }]);

It took me a while to even get to the point where I've isolated down these components, but now I'm pretty stuck.  Any ideas?

[plunker]: http://plnkr.co/edit/fwkF3NnHjkfDh5rhyB6h?p=preview
[toaster]: https://github.com/jirikavi/AngularJS-Toaster
[ui.bootstrap]: http://angular-ui.github.io/bootstrap/