Controlling component data across multiple routes

I have a mapping app that has a full-screen map with a sidebar for information. This app has two routes:

• one route that should display a list of places with markers on the map, for example /places/
• one route that should display a single place with that particular place's marker centered on the map, for example places/1/

My map is currently a Component that is in application.hbs, so it is "outside" of the route templates and persists across route changes. It looks something like:

<div class="page">
  <aside class="sidebar">
      {{outlet}}
  </aside>
  <div class="content">
    {{places-map ... }}
  </div>
</div>

and my routes looks something like:

Router.map(function() {
  this.route('index', { path: '/' });
  this.route('place', { path: "/place/:place_id" });
  this.route('places');
});

So while I have all this set up and working (I can see a list of places and move a single particular place, in both cases with the map in the "background"), I can't understand how my routes can feed information to my component or simply how my routes can communicate with the component that is sitting "outside" of their context?

Is this a possible pattern with Ember and is there a way to achieve it?