Ember: accessing the "ember data" datastore from the utility class
I have a utility class to validate usernames in my ember app and configure it as stated in the ember-cli docs. I am doing client side username validation in several places in my application (components and controllers), so I wanted to pull the validation logic into a reusable method.
The file is in /app/utils/username-validator.js
, and I can successfully add the file to my application by importing it like so:import usernameValidator from 'my-app/utils/username-validator';
This has worked great so far and I've used a pattern for several utility classes. The problem I'm currently running into is that I would like the method to username-validator
include a check to see if the username exists.
Since I am using Ember-Data, I would like to check out Ember-Data store
. By default, storage is only available for controllers and routes. How can I make it available in my class? All of the injection examples I've seen are about injecting storage into other first class Ember objects such as components.
Is it possible to inject storage into a simple utility class?
Thank!
I am using the following versions:
Ember-cli v0.2.6
ember.debug.js:4888 DEBUG: -------------------------------
ember.debug.js:4888 DEBUG: Ember : 1.12.0
ember.debug.js:4888 DEBUG: Ember Data : 1.0.0-beta.18
ember.debug.js:4888 DEBUG: jQuery : 1.11.3
ember.debug.js:4888 DEBUG: Ember Simple Auth : 0.8.0-beta.2
ember.debug.js:4888 DEBUG: -------------------------------
===== Updated with detailed solution based on answer from torazaburo ======
Service creation works great. This is how I did it using ember-cli (v0.2.6) and ember v1.12.0
- Create your service inside
/app/services/<service-name>.js
The service schema would look like this (note that the service name is based on the filename):
import Ember from "ember";
export default Ember.Service.extend({
myFunction: function(){
}
});
- Create an initializer for your service in
/app/initializers/<service-name>.js
, which is used to inject your service into various top-level Ember objects (such as routes, controllers, components, etc.). Note that the name of the initializer file must match the file name of your service.
The initializer schema will look like this:
export function initialize (container, app) {
// Your code here
}
export default {
name: '<service-name>',
initialize: initialize
};
To give a concrete example, let's say your service is named validator
and contains a bunch of validation routines. You want to inject a validator into all controllers, and you also want to inject the Ember Data store into the validator itself. You can do it like this:
export function initialize (container, app) {
// Inject the Ember Data Store into our validator service
app.inject('service:validator', 'store', 'store:main');
// Inject the validator into all controllers and routes
app.inject('controller', 'validator', 'service:validator');
app.inject('route', 'validator', 'service:validator');
}
export default {
name: 'validator',
initialize: initialize
};
source to share
Make your utility a "service" into which you can enter the store. In fact, it looks like your utility should be a service anyway, even if it doesn't need a store. For example, by making this a service, it becomes much easier to stub it when writing tests. With a service, you don't need to import anything or do global injections into initializers, you can just say
export default Ember.Component.extend({
myService: Ember.inject.service(), // inject services/my-service.js
foo: function() {
this.get('myService').api1(...);
}
});