I created the following service and initializer using Ember CLI (generate blueprint):
// services/session.js
import Ember from 'ember';
export default Ember.Object.extend({
loggedIn: false,
...
});
// initializers/session.js
export default {
name: 'session',
initialize: function(container, app) {
app.inject('route', 'session', 'service:session');
app.inject('controller', 'session', 'service:session');
}
};
However, the session is undefined when attempting to access it in a route or controller. Am I missing a step?
// routes/application.js
import Ember from 'ember';
export default Ember.Route.extend({
beforeModel: function() {
var loggedIn = this.session.get('loggedIn'); // undefined
...
}
});
Injected services are lazy loaded, you have to access them via a getter this.get('session') and not directly this.session.
Also, you may want to check out Ember-Simple-Auth if you're doing authentication.
You've got it 99% correct, just seems like a problem with how you're accessing the session.
// routes/application.js
export default Ember.Route.extend({
beforeModel: function() {
var loggedIn = this.get('session.loggedIn');
}
});
Related
I created the following service and initializer using Ember CLI (generate blueprint):
// services/session.js
import Ember from 'ember';
export default Ember.Object.extend({
loggedIn: false,
...
});
// initializers/session.js
export default {
name: 'session',
initialize: function(container, app) {
app.inject('route', 'session', 'service:session');
app.inject('controller', 'session', 'service:session');
}
};
However, the session is undefined when attempting to access it in a route or controller. Am I missing a step?
// routes/application.js
import Ember from 'ember';
export default Ember.Route.extend({
beforeModel: function() {
var loggedIn = this.session.get('loggedIn'); // undefined
...
}
});
Injected services are lazy loaded, you have to access them via a getter this.get('session') and not directly this.session.
Also, you may want to check out Ember-Simple-Auth if you're doing authentication.
You've got it 99% correct, just seems like a problem with how you're accessing the session.
// routes/application.js
export default Ember.Route.extend({
beforeModel: function() {
var loggedIn = this.get('session.loggedIn');
}
});
I hit the above Error: Attempting to inject an unknown injection: service:titleService with the following code:
// initializers/titleService
export default {
name: 'titleService',
initialize: function(container, application) {
application.inject('route', 'titleService', 'service:titleService');
}
};
// services/titleService.js
import Ember from 'ember';
export default Ember.Service.extend({
title(name) {
this.set('title', name);
}
});
// routes/login.js
import Ember from 'ember';
export default Ember.Route.extend({
titleService: Ember.inject.service(),
actions: {
didTransition: function() {
this.set('titleService.title', 'Login Page');
}
}
});
// templates/application.hbs
<div class="page-header">
<h1>{{titleService.title}}</h1>
</div>
{{outlet}}
am I missing anything?
You have to follow the naming conventions of Ember - If you're referring to your service as titleService, then you want the file to be title-service.js, not titleService.js.
Seems like there is an issue where you are trying to inject route into your TitleService. It's probably a typo that should be router instead of route. If you want to use the router inside your service you could also inject the -routing service, but be careful since it is part of the private API.
Example:
import Ember from 'ember';
export default Ember.Service.extend({
routing: inject.service('-routing'),
someFunc() {
const router = get(this, 'routing').router;
// Do something with the router here
}
});
More information can be found in this thread: http://discuss.emberjs.com/t/routing-as-a-service/8550/3
I have a initializer like this:
import Ember from 'ember';
import Session from 'simple-auth/session';
var SessionWithCurrentUser = Session.extend({
store: Ember.inject.service(),
currentUser: function() {
console.log(this.get('store'));
console.log(this.store);
console.log(this.container.lookup('service:store'));
}.property('secure.access_token')
});
export default {
name: 'custom-session',
after: 'ember-data',
initialize(registry) {
registry.register('session:withCurrentUser', SessionWithCurrentUser);
}
};
currentUser gets called on user interaction, long after my app has finished loading. Only the last container lookup gives the store, the other 2 is an object:
{
_lastData: Object,
key: "ember_simple_auth:session"
[..]
}
What's going on? Why can't I inject the store?
It's because store in the current version of simple-auth is being overridden by an instance-initializer with the session storage. The next major version of simple-auth will turn the session storage into a service and we'll be able to do:
import Ember from 'ember';
const { service } = Ember.inject;
export default Ember.Service.extend({
session: service('session'),
store: Ember.inject.service(),
account: Ember.computed('session.content.secure.account_id', function() {
const accountId = this.get('session.content.secure.account_id');
if (!Ember.isEmpty(accountId)) {
return DS.PromiseObject.create({
promise: this.get('store').find('account', accountId)
});
}
})
});
From the dummy app, once https://github.com/simplabs/ember-simple-auth/pull/602 is merged.
I tried to inject the store from the initializer without success, so I use lookup on init in my service, but I don't like it too much, I would rather keep things separated and put the injection in the initializer...
Ember : 1.11.1
Ember Data : 1.0.0-beta.16.1
jQuery : 1.11.2
NOT WORKING:Initializer
//app/initializers/initializer-store.js
export default {
name: 'initializer-store',
after: 'store',
initialize: function(container, application) {
application.inject('service:mtg-level-service', 'store', 'store:main');
}
};
WORKING:Service
//app/services/mtg-level-service.js
import Ember from 'ember';
export default Ember.Service.extend({
availableIn: ['controllers', 'routes'],
store: null,
init: function() {
this._super();
this.set('store', this.container.lookup("store:main"));
}
});
As of Ember v1.10:
import Ember from 'ember';
export default Ember.Service.extend({
store: Ember.inject.service('store')
});
I am trying to register a "session" service from my session initializer.
/services/session.js
/* Imports */
import Ember from 'ember';
/* Session */
var Service = Ember.Object.extend({
sayHi: function() {
console.log('Hello From Session Service');
}
});
/* Exports */
export default Service;
/initializers/session.js
/* Session Initializers */
var Initializer = {
name: 'Session',
initialize: function(Container, App) {
App.register('service:session', App.Session);
// This line doesn't work. See error below.
App.inject('route', 'Session', 'service:session');
// This works, I can access Session from my routes.
App.inject('controller', 'Session', 'service:session');
// This works, I can access Session from my
}
};
/* Export */
export default Initaializer;
Error: Uncaught TypeError: Attempting to register an unknown factory: service:session
Can I not register a service?
You don’t need to register the service, the resolver will look it up for you. I’d adjust things to look like this:
app/services/session.js:
import Ember from 'ember';
export default Ember.Object.extend({
sayHi: function() {
console.log('Hello From Session Service');
}
});
app/initializers/session-service.js:
export default {
name: 'session-service',
initialize: function(container, app) {
app.inject('route', 'session', 'service:session');
app.inject('controller', 'session', 'service:session');
}
};
This is pretty much exactly what you get when using ember generate service session.