Class Errors public

Uses: Ember.Evented

Defined in: ../model/addon/-private/errors.js:14

Holds validation errors for a given record, organized by attribute names.

This class is not directly instantiable.

Every Model has an errors property that is an instance of Errors. This can be used to display validation error messages returned from the server when a record.save() rejects.

For Example, if you had a User model that looked like this:

app/models/user.js

import Model, { attr } from '@ember-data/model';

export default class UserModel extends Model {
  @attr('string') username;
  @attr('string') email;
}

And you attempted to save a record that did not validate on the backend:

let user = store.createRecord('user', {
  username: 'tomster',
  email: 'invalidEmail'
});
user.save();

Your backend would be expected to return an error response that described the problem, so that error messages can be generated on the app.

API responses will be translated into instances of Errors differently, depending on the specific combination of adapter and serializer used. You may want to check the documentation or the source code of the libraries that you are using, to know how they expect errors to be communicated.

Errors can be displayed to the user by accessing their property name to get an array of all the error objects for that property. Each error object is a JavaScript object with two keys:

message A string containing the error message from the backend
attribute The name of the property associated with this error message

<label>Username: <Input @value={{@model.username}} /> </label>
{{#each @model.errors.username as |error|}}
  <div class="error">
    {{error.message}}
  </div>
{{/each}}

<label>Email: <Input @value={{@model.email}} /> </label>
{{#each @model.errors.email as |error|}}
  <div class="error">
    {{error.message}}
  </div>
{{/each}}

You can also access the special messages property on the error object to get an array of all the error strings.

{{#each @model.errors.messages as |message|}}
  <div class="error">
    {{message}}
  </div>
{{/each}}

Methods

add (attribute, messages) public

Module: @ember-data/store

Defined in ../model/addon/-private/errors.js:209

attribute: String; the property name of an attribute or relationship
messages: String[]|string; an error message or array of error messages for the attribute

Manually adds errors to the record. This will trigger the becameInvalid event/ lifecycle method on the record and transition the record into an invalid state.

Example

 let errors = get(user, 'errors');

 // add multiple errors
 errors.add('password', [
   'Must be at least 12 characters',
   'Must contain at least one symbol',
   'Cannot contain your name'
 ]);

 errors.errorsFor('password');
 // =>
 // [
 //   { attribute: 'password', message: 'Must be at least 12 characters' },
 //   { attribute: 'password', message: 'Must contain at least one symbol' },
 //   { attribute: 'password', message: 'Cannot contain your name' },
 // ]

 // add a single error
 errors.add('username', 'This field is required');

 errors.errorsFor('username');
 // =>
 // [
 //   { attribute: 'username', message: 'This field is required' },
 // ]

clear public

Module: @ember-data/store

Defined in ../model/addon/-private/errors.js:374

Manually clears all errors for the record. This will transition the record into a valid state, and will trigger the becameValid event and lifecycle method.

Example:

let errors = get('user', errors);
errors.add('username', ['error-a']);
errors.add('phone', ['error-1', 'error-2']);

errors.errorsFor('username');
// =>
// [
//   { attribute: 'username', message: 'error-a' },
// ]

errors.errorsFor('phone');
// =>
// [
//   { attribute: 'phone', message: 'error-1' },
//   { attribute: 'phone', message: 'error-2' },
// ]

errors.clear();

errors.errorsFor('username');
// => undefined

errors.errorsFor('phone');
// => undefined

errors.get('messages')
// => []

errorsFor (attribute) : Array public

Module: @ember-data/store

Defined in ../model/addon/-private/errors.js:113

attribute: String
returns: Array

Returns errors for a given attribute

let user = store.createRecord('user', {
  username: 'tomster',
  email: 'invalidEmail'
});
user.save().catch(function(){
  user.get('errors').errorsFor('email'); // returns:
  // [{attribute: "email", message: "Doesn't look like a valid email."}]
});

has (attribute) : Boolean public

Module: @ember-data/store

Defined in ../model/addon/-private/errors.js:454

attribute: String
returns: Boolean; true if there some errors on given attribute

Checks if there are error messages for the given attribute.

app/controllers/user/edit.js

import Controller from '@ember/controller';
import { action } from '@ember/object';

export default class UserEditController extends Controller {
  @action
  save(user) {
    if (user.get('errors').has('email')) {
      return alert('Please update your email before attempting to save.');
    }
    user.save();
  }
}

remove (member) public

Module: @ember-data/store

Defined in ../model/addon/-private/errors.js:301

member: String; the property name of an attribute or relationship

Manually removes all errors for a given member from the record. This will transition the record into a valid state, and triggers the becameValid event and lifecycle method.

Example:

 let errors = get('user', errors);
 errors.add('phone', ['error-1', 'error-2']);

 errors.errorsFor('phone');
 // =>
 // [
 //   { attribute: 'phone', message: 'error-1' },
 //   { attribute: 'phone', message: 'error-2' },
 // ]

 errors.remove('phone');

 errors.errorsFor('phone');
 // => undefined

Properties

isEmpty public

Module: @ember-data/store

Defined in ../model/addon/-private/errors.js:199

true if we have no errors.

length public

Module: @ember-data/store

Defined in ../model/addon/-private/errors.js:190

Total number of errors.

messages public

Module: @ember-data/store

Defined in ../model/addon/-private/errors.js:151

An array containing all of the error messages for this record. This is useful for displaying all errors to the user.

{{#each @model.errors.messages as |message|}}
  <div class="error">
    {{message}}
  </div>
{{/each}}