Updating component display from route

To learn more about using services and components, I'm trying to set up a simple flash-message style service. Within my route, I'm saving a record and receiving either a json notice or json error from the server.

Since this is a behavior I'd eventually like to use app-wide, I'm using a simple service (injected into my routes) to handle displaying the message. Within a route, I'm able to call this.get('notification').displayMessage(msg).

Currently the displayMessage function within the service is just alerting the message because I'm stuck on how to create a component that the service can "update". How can a service communicate with a component so that I can send a message and display it from the component template?

profile/index route

user.save().then( (response) => {
  //display response.notice in the app-notification component template
}, (response) => {
  let errors = JSON.parse(response.errors);
  //display response.error in the app-notification component template
  this.get('notification').displayMessage(errors[0]);
}

service

import Ember from 'ember';

const { Service } = Ember;

export default Service.extend({

  displayMessage(msg) {
    alert("message ---> " + msg);
  }
});

component

???

component template

<h2 class="alert">{{message}}</h2>

application template

{{app-notification message=message}}