Use store as a service in a component

Design
1

Hi,

I read in a recent ember release (couldn’t find the link) saying that now the store is available as a service and thus could be used within a component, for example. However, the example only shows how to get records from the store.

I would like to save a record which is a parameter for a component, but when I’ve tried I get this error: Uncaught RangeError: Maximum call stack size exceeded. I think it is because it was not able to find store to handle it.

Is it possible to do this? Furthermore, is this a correct approach to the store usage and components?

Here’s a minimal example of the component I’m thinking of. I usually just have this as a controller, but now that we’re moving towards a component oriented approach I thought I’d try it.

components/store-component.js

import Ember from 'ember';

export default Ember.Component.extend({
  store: Ember.inject.service(),
  actions: {
    delete: function(){
      this.get('record').destroyRecord()
    },
    update: function(){
      this.get('record').save(); 
    }
  }
});

Thanks, Jorge L

2

To get store you need to do: this.get(“store”)…

3

You can do it like that, but I think it goes against the data down, actions up concept.

this.get('store') should give you access to store.

You could also use sendAction, which allows you to have the event sent up the hierarchy and caught in a controller, for example.

4

Thanks, I know I have to use this.get('store') to access the store on a component. However, to perform a save operation, ember cannot find the store as it’s done through the record object and I haven’t found a way to force the record object to use a particular store instance.

@mfeckie: I didn’t know about sendAction, but I think that’s a better approach, thanks! What I have no idea of how to do is tell the controller to apply the action to a particular record (the one associated to the component that triggered the action).

5

Sorry, don’t have access to my repos to check, but I’m pretty sure you can send a context with the action.

this.sendAction('action', context)

where context could be the id or an object that you query when handling the action.

Hope this helps :wink:

1 Like