CODEWITHSUNDEEP
ember.js
user3162553
user3162553

Reputation: 2869

Possible to make a route transition inside of a service in Ember?

I'm using ember-cli 1.13.8 and I have a service that handles most of my logic. Right now I have a function that listens to whether certain things are true or false and then can make a route change based upon that. I'd rather not have to call that function from inside every route since I want it to happen on every route. Its goal is to determine whether the player won and every interaction in the game drives this.

Inside of my game service:

init() {
  ... 
  if(true) {
    console.log("you've won!");
    this.transitionTo("congratulations");
  }
},

Of course, this fails because this isn't a route like Ember expects. I know I can call this method from inside of every route instead but I'm wondering if there is a better way to do this.

Thanks

Edit

So far I've tried importing in the App and then trying to extend the Router. This seems like a bad idea though.

Upvotes: 6

Views: 7255

Answers (3)

DuBistKomisch
DuBistKomisch

Reputation: 1016

As of Ember 2.15, there is a public router service for exactly this use case. Just add router: Ember.inject.service(), to your Ember class and call this.get('router').transitionTo(...);, easy!

Generally this is a bad idea, but in some cases it's easier than passing through route actions in 100 places (personal experience).

The better way to do this from anywhere is to look the router up on the container:

Ember.getOwner(this).lookup('router:main').transitionTo(...);

this has to be some container allocated Ember object, which includes components, services, and Ember Data models.

Note also that if this will be called a lot, you will want to store the router as a property. You can do this in the init hook:

init() {
  this._super(...arguments);
  this.set('router', Ember.getOwner(this).lookup('router:main'));
}
...
this.get('router').transitionTo(...);

Ember.getOwner(this) works in Ember 2.3+, prior to that you can use this.get('container') instead.

Upvotes: 9

Daniel
Daniel

Reputation: 18682

Ember 1.13:

Create another service called routing:

import Ember from 'ember';

export default Ember.Service.extend({
    _router: null,

    init() {
        this._super();

        this.set('_router', this.get('container').lookup('router:main'));
    },

    transitionTo() {
        this.get('_router').transitionTo(...arguments);
    }
});

Then you can:

routing: Ember.inject.service(),

goSomewhere() {
    this.get('routing').transitionTo('index');
}

Upvotes: 0

dwickern
dwickern

Reputation: 3519

You can use the routing service (which is a private API):

routing: Ember.inject.service('-routing'),

init() {
  ... 
  if(true) {
    console.log("you've won!");
    this.get("routing").transitionTo("congratulations");
  }
},

Upvotes: 24

Related Questions