Angular 2 eventos componentes secundarios transmitidos a los padres

Me gustaría implementar el patrón Angular 1.x común de tener directivas secundarias dentro de una directiva principal en Angular 2. Aquí está mi estructura deseada.

<foo>
  <bar>A</bar>
  <bar>B</bar>
  <bar>C</bar>
</foo>

Me gustaría para estosBar&nbsp;componentes para tener eventos de clic que se emiten aFoo&nbsp;componente.

Aquí está miFoo&nbsp;hasta aquí:

@Component({
  selector: 'foo',
  template: `
    <div>
      <ng-content></ng-content>
    </div>
  `
})
export class Foo {
   @ContentChildren(Bar) items: QueryList<Bar>;
}

Y aquí está miBar:

@Component({
  selector: 'Bar',
  template: `
    <div (click)="clickity()">
      <ng-content></ng-content>
    </div>
  `
})
export class Bar {
  clickity() {
    console.log('Broadcast this to the parent please!');
  }
}

¿Cómo hago para notificar?Foo&nbsp;cada vez que uno de susBars&nbsp;se hace clic?