emberjs: transitionToRoute Error no method 'addArrayObserver

Question

From the 'job' route I am trying to transition to 'careers' route using following code.

<script type="text/x-handlebars" data-template-name="job">
    <button {{action 'backToCareers' this}}>Back</button>
</script>

The controller with following gives 'Uncaught TypeError: Object # has no method 'addArrayObserver' ' error.

CareerApp.JobController = Ember.ObjectController.extend({
    backToCareers: function(){
       this.transitionToRoute('careers');
    }
});

If I change the code(see below) to provide model object the error changes to 'Uncaught More context objects were passed than there are dynamic segments for the route: careers '

CareerApp.JobController = Ember.ObjectController.extend({
    backToCareers: function(){
           var jobs = CareerApp.Job.findAll();
       this.transitionToRoute('careers', jobs);
    }
});

Following is the code of my Model and the router

CareerApp.Job = Ember.Model.extend({
  refNo: '',
  title: ''
});

CareerApp.Job.reopenClass({
 findAll: function(){
  return $.getJSON("http://site/jobs").then(
     function(response){
        var jobs = Ember.A();
        response.forEach(function(child){
           jobs.pushObject(CareerApp.Job.create(child));
        });
        return jobs;
     }
  );
 }
});

Router code

CareerApp.Router.map(function(){
 this.resource('careers', {path: '/'});
 this.resource('job', {path: '/jobs/:job_id'});
});

CareerApp.CareersRoute = Ember.Route.extend({
   model:function(){
       return CareerApp.Job.findAll();
   }
});

CareerApp.CareersController = Ember.ArrayController.extend({
   gradJobCount: function () {
       return this.filterProperty('isExp', false).get('length');
   }.property('@each.isExp')
});

The 'carreers' route doesn't include any dynamic segments, so this.transitionToRoute('careers'); is the way to go. Update the question with CareerApp.CareersRoute. — andrei1089

andrei1089 andrei1089 · Accepted Answer · 2013-08-20T19:55:13

The model hook is expected to return an array but you return a jQuery promise object. findAll should return an empty array which is filled when the callback is executed.

 findAll: function() {
     var jobs = [];

     $.getJSON("http://site/jobs").then(function(response){
         response.forEach(function(child){
             jobs.pushObject(CareerApp.Job.create(child));
         });
    });
    return jobs;
 }

emberjs: transitionToRoute Error no method 'addArrayObserver

2 Answers