# Using Ember Services in Discourse plugins

**URL:** https://meta.discourse.org/t/using-ember-services-in-discourse-plugins/51713
**Category:** Development
**Created:** [October 18, 2016, 9:42pm UTC](https://meta.discourse.org/t/using-ember-services-in-discourse-plugins/51713 "2016-10-18T21:42:47Z")
**Posts on this page:** 8
**Page:** 1

<div class="post-metadata">

### Author: ![david](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/david/32/157490_2.png) [@david](https://meta.discourse.org/u/david)
#### Post date: [October 18, 2016, 9:42pm UTC](https://meta.discourse.org/t/using-ember-services-in-discourse-plugins/51713/1 "2016-10-18T21:42:47Z")

</div>

I am attempting to make use of Ember “[Services](https://guides.emberjs.com/v1.13.0/understanding-ember/dependency-injection-and-service-lookup/)” in a discourse plugin. Right now I am just trying to get a simple proof of concept working based off of [this tutorial](http://www.programwitherik.com/ember-services-tutorial/) online. Unfortunately I can’t get it working and am not sure if it’s something to do with how plugins are loaded in discourse, or if I’m just doing something wrong. Any help would be appreciated!

Right now the plugin is purely clientside, so the plugin.rb just has basic info.

```plaintext
# name: Test Plugin
# about: A plugin to test Ember services in Discourse
# version: 0.0.1
# authors: David Taylor

```

```plaintext
// plugins/myplugin/assets/javascripts/discourse/components/comp-test.js.es6
import Ember from 'ember';  
var inject = Ember.inject;

export default Ember.Component.extend({  
    start: inject.service(),
    message: 'test',
    actions: {
        pressMe: function() {
            var testText = this.get('start').thisistest();
            this.set('message',testText);
            console.log(this.get('start').isAuthenticated);
        }
    }
});

```

```plaintext
// plugins/myplugin/assets/javascripts/discourse/services/start.js.es6
import Ember from 'ember';

export default Ember.Service.extend({  
    isAuthenticated: true,
    thisistest: function() {
        return "hello world";
    }
});

```

```plaintext
<!-- plugins/myplugin/assets/javascripts/discourse/templates/components/comp-test.hbs -->
<button {{action "pressMe"}}>push me</button><br>  
{{message}}

```

```plaintext
<!-- plugins/myplugin/assets/javascripts/discourse/templates/connectors/discovery-list-container-top/testfile.hbs -->
<span>Hello World widget here: {{comp-test}}</span>

```

When the button is clicked, I get an error in the javascript console:  
`Uncaught TypeError: Cannot read property 'thisistest' of undefined`  
which I believe just means that the Service hasn’t been loaded/injected properly. I’m unsure of how to go about debugging this further.

---

<div class="post-metadata">

### Author: ![eviltrout](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/eviltrout/32/5275_2.png) [@eviltrout](https://meta.discourse.org/u/eviltrout)
#### Post date: [October 19, 2016, 3:45pm UTC](https://meta.discourse.org/t/using-ember-services-in-discourse-plugins/51713/2 "2016-10-19T15:45:52Z")

</div>

I don’t think we are currently using Ember services so I don’t have a good proof of concept for this.

It could be that our version of Ember doesn’t support them with this syntax?

---

<div class="post-metadata">

### Author: ![david](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/david/32/157490_2.png) [@david](https://meta.discourse.org/u/david)
#### Post date: [October 19, 2016, 3:49pm UTC](https://meta.discourse.org/t/using-ember-services-in-discourse-plugins/51713/3 "2016-10-19T15:49:30Z")

</div>

Ember 1.13 does support them (I think), the tutorial I linked to says it’s for 1.13.

Maybe you can help me come up with a “Discourse-y” way of doing what I need that doesn’t use services. I’m trying to create a “who’s online” widget which will use the messagebus to be live-updated. I can make an ember “Component” which handles the UI, but I somehow need to get the array of users to be updated whenever a new message is received on the messagebus. Note that the component might be created/destroyed based on the current page that the user is viewing (I think). My plan was to have the singleton service manage the data, and then “bind” it to a field in the component.

I’m very new to Ember so sorry if this is a stupid question!

---

<div class="post-metadata">

### Author: ![eviltrout](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/eviltrout/32/5275_2.png) [@eviltrout](https://meta.discourse.org/u/eviltrout)
#### Post date: [October 19, 2016, 4:22pm UTC](https://meta.discourse.org/t/using-ember-services-in-discourse-plugins/51713/4 "2016-10-19T16:22:42Z")

</div>

I think the approach you are taking is correct in that case. I can suggest another way to do a singleton but maybe we should try and get this working the ember way?

Actually I looked and we do have a few ember services already! They’re just not used via `Ember.inject`. The problem is probably that the resolver we use doesn’t resolve them.

I suspect if you add a `resolveService` method to [the custom resolver](https://github.com/discourse/discourse/blob/master/app/assets/javascripts/discourse-common/resolver.js.es6#L103) it might work!

If not, maybe add some debugging to see what `Ember.inject` is looking up?

---

<div class="post-metadata">

### Author: ![david](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/david/32/157490_2.png) [@david](https://meta.discourse.org/u/david)
#### Post date: [October 19, 2016, 8:46pm UTC](https://meta.discourse.org/t/using-ember-services-in-discourse-plugins/51713/5 "2016-10-19T20:46:32Z")

</div>

> [@eviltrout](#):
>
> I suspect if you add a resolveService method to the custom resolver it might work!

Just gave this a try and it worked first time 🙂

Just added this to the custom resolver:

```plaintext
   resolveService(parsedName) {
      return this.customResolve(parsedName) || this._super(parsedName);
    },

```

Is there any way for me to add this method from my plugin? Or if not is a pull request to the main discourse repo likely to be accepted?

---

<div class="post-metadata">

### Author: ![eviltrout](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/eviltrout/32/5275_2.png) [@eviltrout](https://meta.discourse.org/u/eviltrout)
#### Post date: [October 19, 2016, 9:06pm UTC](https://meta.discourse.org/t/using-ember-services-in-discourse-plugins/51713/6 "2016-10-19T21:06:07Z")

</div>

It should definitely be a pull request to master to add this. I can see many people wanting to add services the idiomatic way!

---

<div class="post-metadata">

### Author: ![david](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/david/32/157490_2.png) [@david](https://meta.discourse.org/u/david)
#### Post date: [October 19, 2016, 9:14pm UTC](https://meta.discourse.org/t/using-ember-services-in-discourse-plugins/51713/7 "2016-10-19T21:14:29Z")

</div>

Ok, hopefully I’ve done that correctly - let me know if not! 🙂

[https://github.com/discourse/discourse/pull/4509](https://github.com/discourse/discourse/pull/4509)

---

<div class="post-metadata">

### Author: ![JQ331](https://avatars.discourse-cdn.com/v4/letter/j/41988e/32.png) [@JQ331](https://meta.discourse.org/u/JQ331)
#### Post date: [February 6, 2022, 9:39pm UTC](https://meta.discourse.org/t/using-ember-services-in-discourse-plugins/51713/8 "2022-02-06T21:39:43Z")

</div>

HI. I’m trying to get a service to work in discourse. I originally asked the question in this topic, but then thought it made more sense to create a new topic for it:

> [@How to inject a service in discourse?](https://meta.discourse.org/t/how-to-properly-inject-a-service-in-discourse/217533):
>
> I want to use a service in a theme component I am building. If services are only available in plugins, I can build a plugin as well. Goal is to connect two different plugin outlets - press a button in one outlet, and have that button press picked up by the other outlet. How can I properly register a service in Discourse? I’ve followed the topic [here](https://meta.discourse.org/t/using-ember-services-in-discourse-plugins/51713), and the related plugin code on github, but I’m not able to get it to work. I think the missing piece is that my theme component is not recognizin…
