title: Getting value from directive for future use
body: <p>I’m trying to get a toolbar fixed in the bottom of the window but other component keeps getting on top of it when I scroll down. The solution I came up with, was getting the height of the toolbar, and giving the “other component” THAT value in margin/padding bottom. So it will never get on top of it. </p>
  
  <p><strong>get-height-directive.ts</strong></p>
  
  <pre><code>import { Directive, ElementRef, OnInit } from '@angular/core';
  import { EventEmitter } from '../../../../node_modules/protractor';
  
  @Directive({
    selector: '[appGetHeight]'
  })
  
  export class GetHeightDirective implements OnInit{
    constructor(public el: ElementRef) {}
  
    ngOnInit() {
      let styles = getComputedStyle(this.el.nativeElement);
      console.log(styles.height);
    }
  
  }
  </code></pre>
  
  <p>I applied that directive into this:</p>
  
  <p><strong>where-to-apply-directive.html</strong></p>
  
  <pre><code>    &lt;div appGetHeight class="col"&gt;
        &lt;p &gt;Lorem ipsum dolor sit amet consectetur adipisicing elit. Architecto ipsum repellat illum corporis, possimus consequatur qui nisi ipsa in. Molestiae, dolor. Fugit, eum quas. Provident neque id optio facilis velit.&lt;/p&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p>With this I get the height of the toolbar in a <code>console.log</code> that says something like <code>66.8px</code>. I want to use that '100px' now to style the margin-bottom of an element of a sibling component but I couldn't find any solution.</p>
  
  <p>Thanks for the help.</p>