title: AngularJS Kendo Autocomplete will not load on page
body: <p>I am new to Angular and I am having a problem loading the Kendo autocomplete control
  I have an app.js file and a html view called main.html and I cannot get the dropdown to show for the Kendo autocomplete.</p>
  
  <p>HTML Code:</p>
  
  <pre><code>&lt;div id="example" ng-app="KendoDemos"&gt;            
  &lt;div class="demo-section k-content" ng-controller="idocCtrl"&gt;       
                   &lt;label &gt;Location&lt;/label&gt;
                   Locations: {{carsLocations}}
                  &lt;!--&lt;input type="text" data-ng-model="carslocationstest"&gt;--&gt;
                      &lt;input kendo-auto-complete ng-model="Cars" k-options="options"          style="width:200px;background-color:coral;"&gt;
                      &lt;p&gt;Your selection: {{ Cars }}&lt;/p&gt;
   &lt;/div&gt;
   &lt;/div&gt;
  </code></pre>
  
  <p>JS code</p>
  
  <pre><code>var idocCtrl = ['$scope', '$route', '$upload', '$http', '$location', '$filter', '$interval', '$timeout', function( $scope, $route, $upload, $http, $location , $filter, $interval, $timeout) {
  /* Scope Properties */
  $scope.selectedSIS = '';
  $scope.TEST1 ='';
  
  $scope.carsLocations=[
      {"Name": "The Art Institues of Pittsburgh", "Id": "005"},
      {"Name": "The Art Institues of Atlanta", "Id": "004"},
      {"Name": "The Art Institues of Chicago", "Id": "001"},
      {"Name": "The Art Institues of New York", "Id": "002"},
      {"Name": "The Art Institues of Miami", "Id": "003"}
  </code></pre>
  
  <p>I am able to right out the scope.carsLocation to the screen but the dropdown will not load the items.</p>
  
  <p>Also i verified that my css and js are being  call in the same order as most examples I found.</p>