Passing an Array to a Component in ember 2.2

I am trying to display a simple list using a component. I was reading controllers were going to be limited use in 2.0 so I am unsure why this isn't working. I would appreciate any guidance.

html

<script type="text/x-handlebars" id="index">
  <h2>Ember.js 2.2.0 - Display List</h2>
  {{display-list items=listItems}}
</script>

<script type="text/x-handlebars" id="components/display-list">
List:
  <ul>
    {{#each items as |item|}}
      <li>{{item}}</li>
    {{/each}}
  </ul>
</script>

javascript

var App = Ember.Application.create();


App.IndexRoute = Ember.Route.extend({
  model: function() {
    return {
      listItems:  [ "Item 1", "Item 2" ]      
    };
  }
});


App.DisplayListComponent = Ember.Component.extend({
});

http://ift.tt/1lPhYnM