Set Ember controller property false when changing route

Question

I have a music component playing the favorites songs retrieved from the SoundCloud API inside the Music Page of my website.

{{soundcloud-player favorite=currentFavorite sound=currentFavoriteObject position=currentFavoritePosition isPlaying=isPlaying isBuffering=isBuffering}}

The problem is once i play a song and i change page ( route ) of the website , the songs keeps playing, to resolve it i need to set isPlaying false anytime i change the Music route of the page.

I see there are different ways to achieve it but i can not figure it out for my case

Mi tries

From a different controller

needs:'player',
desactivateIsplaying: function(){
    var controller = this.get('controllers.player');
    controller.set('isPlaying', false);
}

or from a different route

desactivateIsPlaying: function(){
    var controller = this.controllerFor('player');
    controller.set('isPlaying', false);
}

In any of the two functions i can not set isPlaying false, i have also seen mentioned the willTransition route action, how can i use it? is there any better way do that? If necessary i can make a twiddle ember to reproduce better the scenario

Answer 1

Using willTransition on your route is a good option.

music/route.js

import Ember from 'ember';

const { Route } = Ember;

export default Route.extend({
  actions: {
    willTransition() {
      this.controller.set('isPlaying', false);
    }
  }
});