title: alert() in angularjs causes 5 messages instead one
body: <p>Probably it is "old school" using alerts when learn or debug JS, but sometimes I decline to such approach. I am learning angularjs, and it is very difficult to understand scheduling, I mean step by step how angularjs is executing different directives.
  As an instance, here small app in angularjs, and I can not understand why on one alert there are 5 messages??? </p>
  
  <p><a href="http://plnkr.co/edit/8j7D0J0a6By447whhpa3?p=preview" rel="nofollow">http://plnkr.co/edit/8j7D0J0a6By447whhpa3?p=preview</a></p>
  
  <pre><code>&lt;!doctype html&gt;
  &lt;html&gt;
  &lt;head&gt;
      &lt;title&gt;&lt;/title&gt;
  
  &lt;style&gt;
  
  .red
    {
      color:red;
    }
  &lt;/style&gt;
  
      &lt;script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.min.js"&gt;&lt;/script&gt;
      &lt;script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.16/angular-route.js"&gt;&lt;/script&gt;
      &lt;script src="script.js"&gt;&lt;/script&gt;
  &lt;/head&gt;
  
  &lt;body ng-app="demoApp"&gt;
      &lt;div ng-controller="testCntr"&gt;
        &lt;span ng-class="{red: setClass()}"&gt;Test color&lt;/span&gt;
        &lt;div&gt;{{setClass()}}&lt;/div&gt;
      &lt;/div&gt;
  
  
  &lt;/body&gt;
  &lt;/html&gt; 
  </code></pre>
  
  <p>JS</p>
  
  <pre><code>demoApp = angular.module('demoApp',[]);
  
  demoApp.controller('testCntr', function ($scope) {
  
    $scope.setClass = function () {
      alert('test');
      return true;
    }
  
  });
  </code></pre>