title: AngularJS - why "Error: ng:areq Bad Argument"?
body: <p>I am trying to follow <a href="http://jsfiddle.net/sebmade/swfjT/" rel="nofollow">this example</a> but all I got is </p>
  
  <pre><code>Error: ng:areq
  Bad Argument
  Argument 'DefaultCtrl' is not a function, got undefined
  </code></pre>
  
  <p>Can anyone tell exactly why? DefaultCtrl is there, why it is not seen?</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
      &lt;script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"&gt;&lt;/script&gt;
      &lt;script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular-animate.min.js"&gt;&lt;/script&gt;
      &lt;script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular-aria.min.js"&gt;&lt;/script&gt;
      &lt;script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular-messages.min.js"&gt;&lt;/script&gt;
      &lt;link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/angular-material/1.0.6/angular-material.css"&gt;
      &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/angular-material/1.0.6/angular-material.min.js"&gt;&lt;/script&gt;
      &lt;script&gt;
          function DefaultCtrl($scope) {
              $scope.names = ["john", "bill", "charlie", "robert", "alban", "oscar", "marie", "celine", "brad", "drew", "rebecca", "michel", "francis", "jean", "paul", "pierre", "nicolas", "alfred", "gerard", "louis", "albert", "edouard", "benoit", "guillaume", "nicolas", "joseph"];
          }
  
          angular.module('app', []).directive('autoComplete', function($timeout) {
              return function(scope, iElement, iAttrs) {
                      iElement.autocomplete({
                          source: scope[iAttrs.uiItems],
                          select: function() {
                              $timeout(function() {
                                iElement.trigger('input');
                              }, 0);
                          }
                      });
              };
          });
      &lt;/script&gt;
  
  &lt;/head&gt;
  
  &lt;body&gt;
      &lt;form method=post&gt;
      &lt;div ng-app='app' &gt;
          &lt;div ng-controller='DefaultCtrl'&gt;
              &lt;input auto-complete ui-items="names" ng-model="selected"&gt;
              selected = {{selected}}
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;input type=submit&gt;
      &lt;/form&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>