title: I want to walk up the visual tree of an Angular 4x application
body: <p>I'm in an Angular4x component. I want to find a parent component, maybe one to two levels above. I'm using ng-content in the parent so normal input bindings aren't working for me.  I'm good with walking up the tree in code, to grab parent. But how would I do that.  In WPF I'd use the VisualTreeHelper which uses the .parent property of every component.  </p>
  
  <p>What I'm looking for here is to the get the objectId of app-report-container (a numeric property) to the app-two-dates (see reportContainerId) (any way possible)</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>  &lt;app-report-container
      container-title="Sales Dashboard"
      report-template="SalesDashboard"
      get-data="getSalesDashboardData"
      minimum-rptsection-height="107px"
      style="width: 1000px"
    &gt;
  
      &lt;app-two-dates date1text="Period1:" date2text="Period2:" reportContainerId="{{objectIdOfAppReportContainer}}"&gt;&lt;/app-two-dates&gt;
  
    &lt;/app-report-container&gt;</code></pre>
  </div>
  </div>
  </p>