Access store inside component


#1

I’ve the following code:

export default Ember.Component.extend({
  store: Ember.inject.service(),
  types: [ 'Task', 'Discussion', 'Note' ],
  projects: this.get('store').find('user', 1).then(user => user.get('projects')),
  actions: {
    save() {
      ...
    }
  }
})

I want to access store in line 4 like projects: this.get('store').find('user', 1).then(user => user.get('projects')).

How can I do that?


#2

I got this in a component and works fine (actually several…each just a “property” with data coming from the store

Still a n00b though, don’t know why you got “then”? Might have misunderstood!

  ...
  
  store: Ember.inject.service(),

  dealtypes: Ember.computed({
      get() {
      // Since we are using Ember.inject.service, we need to call the store using the get helper
          return this.get('store').findAll('dealtype');
      }
  }).readOnly(),
  ....

#3

This works but when I try a promise version below

/app/template/component/awesome-component.hbs

<ul>
  {{#each (await countryProp) as |elem|}}
    <li>{{elem.name}}</li>
  {{/each}}
</ul>

/app/components/awesome-component.js

import Ember from 'ember';

export default Ember.Component.extend({

  store: Ember.inject.service(),
  countryProp: Ember.computed('countries', function() {
    return this.get('countryTask').perform();
  }),

  countryTask: task(function*() {
    const countries = yield this.get('store').findAll('country');
    return countries;
  })

});

The error is ‘components/awesome-component.js: line 18, col 16, ‘task’ is not defined.’

Any help appreciated as I am a complete noob with ember.


#4

Add this import:

import { task } from 'ember-concurrency';

#5

Thanks, I installed the library, it built successfully but the application page is blank, the console has no errors