title: Computed property in controller based on route's model in EmberJS
body: <p>I want to implement computed property in controller that changes when data in route's model changed.</p>
  
  <p>Route:</p>
  
  <pre><code>import Ember from 'ember';
  
  export default Ember.Route.extend({
      model() {
          return new Ember.RSVP.hash({
              ingredients: this.store.findAll('ingredient'),
              recipes: this.store.peekAll('recipe')
          });
      },
  
      setupController: function(controller, modelHash) {
          controller.setProperties(modelHash);
      }
  });
  </code></pre>
  
  <p>Controller:</p>
  
  <pre><code>import Ember from 'ember';
  
  export default Ember.Controller.extend({
      pageNumber: 0,
      pageSize: 16,
  
      pages: function() {
          var pages = [];
          if (this.model != null) {
              var content = this.model.recipes;
              while (content.length &gt; 0) {
                  pages.push(content.splice(0, this.get("pageSize")));
              }
          }
          return pages;
      }.property('model.recipes.@each', 'pageSize'), 
  
      recipesOnPage: function() {
          return this.get('pages')[this.get('pageNumber')];
      }.property('pages', 'pageNumber')
  });
  </code></pre>
  
  <p>This code produce no error, but doesn't work - "pages" always empty. And "pages" property doesn't recomputed on model changing. What am I doing wrong? And how to achieve desired result?</p>
  
  <p>P.S. Ember version - 1.13.</p>