Ember route communication with unrelated component

Question

I know EmberJS promotes "data down, actions up", but I have a scenario that I'm not sure how to fit into that paradigm. It's best if I explain by an example that's analogous to what I'm trying to achieve.

Let's say I have a fixed header component ('fixed-header'). I want this header to appear always, so of course I add it to my main application template:

{{fixed-header}}
{{outlet}}

Now let's say I want my header to display some information about the route I'm on. For simplicity's sake, let's say each route has a title I want displayed in the fixed header. So whether I'm on /foo or /foo/bar/baz or /wackawacka/meh?cat=meow, I want that route to be able to send some data to fixed-header component to display. In other words, I kinda want to go against "data down" and do a "data up".

What is the ideal way to approach this? My first instinct was to create a service that my-header listens to and routes can post their information to. But is that the right thing to do? It seems weird to me to create a service just to send a little bit of text. Is there another way?

Answer 1

You could use a parameter for your component.

{{fixed-header info=headerInfo}}
{{outlet}}

And then in any route in some hook

setupController: function(controller, model) {
  this._super(controller, model);
  var headerInfo = ...
  this.controllerFor('application').set('headerInfo', headerInfo);
}