title: Creating a basic data grid with Kendo UI and AngularJS
body: <p>I'm experimenting with AngularJS. I want to show a basic Kendo Grid. I'm trying to do this using pure directives. With that in mind, I've looked at the Kendo UI / Angular JS project (<a href="https://github.com/kendo-labs/angular-kendo" rel="noreferrer">https://github.com/kendo-labs/angular-kendo</a>). Unfortunately, my </p>
  
  <p><strong>index.html:</strong></p>
  
  <pre><code>&lt;div&gt;Products: {{products.length}}&lt;/div&gt;
  &lt;div kendo-grid k-data-source="products" k-selectable="'row'"
    k-pageable='{ "refresh": true, "pageSizes": true }'
    k-columns='[
      { "field": "Name", "title": "Name"},
      { "field": "Department", "title": "Department"},
      { "field": "LastShipment", "title": "Last Shipment" }
    ]'&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>controllers.js</strong></p>
  
  <pre><code>function myController($scope) {
      console.log("initializing controller...");
      $scope.products = [
          { id:1, name:'Tennis Balls', department:'Sports', lastShipment:'10/01/2013' },
          { id:2, name:'Basket Balls', department:'Sports', lastShipment:'10/02/2013' },
          { id:3, name:'Oil', department:'Auto', lastShipment:'10/01/2013' },
          { id:4, name:'Filters', department:'Auto', lastShipment:'10/01/2013' },
          { id:5, name:'Dresser', department:'Home Furnishings', lastShipment:'10/01/2013' }
      ];
  }
  </code></pre>
  
  <p>I've verified that I've wired up the controller properly. The activity count shows properly. However, the grid does not appear. I can't figure out what I'm doing incorrectly.</p>
  
  <p>Thank you for your help.</p>