title: Observable from Observable
body: <p>In Angular I am using a Modal Directive inside a component which emits <code>onHide</code> event (EventEmitter) when modal is closed.</p>
  
  <p>This component is a dialog component, its template defines a dialog, Modal Directive (<em>bsModal</em> below) makes it modal.</p>
  
  <pre><code>&lt;div bsModal #modal="bs-modal" class="modal fade" role="dialog" tabindex="-1" [config]="{backdrop: 'static',keyboard:'false'}"&gt;
  ...
  &lt;/div&gt;
  </code></pre>
  
  <p>I need to Output a <code>close</code> event from component when Modal Directive emits its <code>onHide</code> event.</p>
  
  <p>Here's how I am doing it:</p>
  
  <pre><code>export class DialogComponent implements OnInit {
      @ViewChild('modal') modal: ModalDirective;
      @Output() close = new EventEmitter&lt;any&gt;(); // Component's close event emitter
      ...
      ngAfterViewInit() {
          this.modal.onHide.subscribe(() =&gt; {
              this.close.emit();
          });
      }
      ...
  }
  </code></pre>
  
  <p>Something tells me that there's a better way to achieve this, that somehow I can define component's <code>close</code> event based on directive's <code>onHide</code> observable, which will save me from subscribing directive's <code>onHide</code>.</p>
  
  <p>What is that better way?</p>