Ember errors.add inside catch after save causes form button to not respond

My server responds with a 400 status if a book title already exists. The ember app catches the error and does a errors.add with the attribute name and error detail. For some reason when a receive the 400 when I change the title the form submit button is dead. I found that when I eliminate the errors.add line the problem goes away.

Here is my action:

import Ember from 'ember';
import DS from 'ember-data';

export default Ember.Route.extend({

  model() {
    return this.store.createRecord('book');
  },

  setupController: function(controller, model) {
    controller.set('book', model);
    controller.set('errors', DS.Errors.create());
  },

  actions: {

    createBook: function(book) {

      var _this = this;
      var errors = _this.controllerFor('books.new').get('errors');
      book.save().then(function(book) {

        _this.transitionTo('books.book', book);

      }).catch(function(response) {

        response.errors.forEach(function(error) {
          var attribute = error.source.pointer.split('/')[3];
  //This line causes the problem---> errors.add(attribute, error.detail);

        });
      });

    }

  }
});

This is the response:

  res.status(400).send({
    errors: [
      {
        status: "400",
        source: { pointer: '/data/attributes/title' },
        title: "Invalid Attribute",
        detail: 'must be unique'
      }
    ]
  });