How to throw Ember.js errors?

Asked By: Anonymous

In an ember.js application, how can we throw application errors (and have them bubble through the controller-route-application hierarchy?)

My use case is related to catching non ember-data ajax errors and handling them through the same path as ember data errors.

(i.e. when experiencing an error from a non-restful endpoint, allow that error to bubble through the application similar to ember-data errors)

Solution

Answered By: Anonymous

Ember has its own EmberError class which sub classes the Javascript error class.

import EmberError from '@ember/error';

export default Route.extend({
  /* Pseudo code... */
  model() {
    if(/* something bad happens */) {
      throw new EmberError('Oh, no! Something bad happened!');
    }
  },
});

You can do something with it in an error action in your route. If you want it to bubble up, remember to return true.

actions: {
  error(error) {
    // do something
    return true;
  },
},

Ember automagically creates an error substate and a error template where you can display info about the error (without redirecting). You can show error info in application-error.hbs or error.hbs like so:

<h1>{{model.name}} {{model.status}}</h1>
{{model.stack}}

See the Ember substate guide for more options.