Redirecting to error state from action in Ember.js controller

Question

While writing my first app in Ember.js II ran into a problem where I wanted to execute an action through calling some API with jQuery. When this call fails, I want the page to be redirected to the error state.

I've been trying to get my head around this one. I created an action like this:

Contributionkeeper.RepositoriesController = Ember.Controller.extend({
  actions: {
    delete: function(repo) {
      Ember.$.ajax({ 
        url: '...', 
        success: function(data) { }, 
        error: function() { 
          //TODO: Raise error
        });
    }
  }
});

I want the application to navigate to an error substate. How can I fix this?

Answer 1

It will depend on what whether you want to enter a specific error state (for the general application, one specific to Repositories, etc).

The general idea is to transition to the state you wish as follows:

Contributionkeeper.RepositoriesController = Ember.Controller.extend({
  actions: {
    delete: function(repo) {
      Ember.$.ajax({ 
        url: '...', 
        success: function(data) { }, 
        error: function() { 
            return this.transitionTo('yourErrorLocation');
        });
    }
  }
});

See the documentation regarding Loading and Error substates for more details.