Search code examples
javascriptnode.jsember.jsember-data

How do I use a service property in a route?


I have a service that handles user authentication and gets the user data via a model. One of the pieces of data that it fetches is a date for the start of a dietary program. I want to use this date to calculate a number: the number of days since the start of the program, so I can use that number to query a different model that pulls content from a CMS.

I haven't been able to access that number anywhere other than a template.

This is the Controller for Dashboard

import Ember from 'ember';

export default Ember.Controller.extend({

  authManager: Ember.inject.service('session'),
    });

This is the template

{{#if authManager.currentUser.activeCleanse}}
  You are on a cleanse that starts 
{{authManager.currentUser.cleanse_start}}
  {{else}}
  You are not on a cleanse.
{{/if}}

All of the above code works, but when I try something like this in the controller:

  activeCleanse: Ember.computed( function(){
    return this.get('authManager.currentUser').then( (user) => {
    return user.cleanse_active;
    }.bind(this))
  }),

  startDate: Ember.computed( function(){
    return this.get('authManager.currentUser').then( (user) => {
    return user.cleanse_start;
    }.bind(this))
  })

And replace the template with:

{{#if activeCleanse}}
  You are on a cleanse that starts {{startDate}}
  {{else}}
  You are not on a cleanse.
{{/if}}

It doesn't respond to activeCleanse being false (the template only seems to be checking for its existence) and the date tag only shows [object Object].

I am actually trying to get the date in the controller so I can manipulate it to pass as one of the parameters to the dashboard route, which gets a model based on the specific day:

The Dashboard Route

import Ember from 'ember';

export default Ember.Route.extend({

  model() {
    return this.get('store').queryRecord('cleanse-post', {
      filter: {
        tag: 'day-1'
        }
      });
    },

});

I want to be able to dynamically set the tag for the filter based on the calculation for the date.

Any help would be appreciated. I feel like I've been going in circles with this and I have no idea what to try.


Solution

    1. activeCleanse it's computed property depends on authManager.currentUser,so your computed property format should be like this
         activeCleanse: Ember.computed('authManager.currentUser',function(){
          //return the result
         }),
    

    There is no need for bind(this) since that computed property will be called with particular context, in your example this would be controller.

    1. Currently your computed property is returning Promise, computed property is not promise aware. you can try returning DS.PromiseObject to make it work.
        activeCleanse:Ember.computed(function(){
            return DS.PromiseObject.create({
              promise: this.get('authManager.currentUser').then( (user) => {
                return user.cleanse_start;
              })
          })
    

    In your case, I would say you can use setupController hook on the route, where you can set activeCleanse property,

    this.get('authManager.currentUser').then( (user) => {
      this.set('activeCleanse,user.cleanse_active);
    });