0

I have a Angular2 template like this:

     <app-tab [Title]="'Test1'">
        <app-component-one></app-component-one>
     </app-tab>

     <app-tab [Title]="'Test2'">
        <app-component-two></app-component-two>
     </app-tab>

Now, how can I access the app-component-one or app-component-two in app-tab?

The output from app-tab should be something like this:

<div>
  <div class="panel-heading">
    <h1 class="panel-title">Test 1</h1>
    <div>CONTENT FROM app-component-one</div>
  </div>
</div>

Thank you

Suraj Rao
  • 29,388
  • 11
  • 94
  • 103
Franz Peter Tebartz van Elst
  • 1,609
  • 3
  • 10
  • 26
  • Use @ViewChild(AppComponentOne) and access it in ngAfterViewInit. Like this: http://learnangular2.com/viewChild/ – Michael Kang Mar 20 '17 at 10:17
  • http://stackoverflow.com/questions/32693061/angular-2-typescript-get-hold-of-an-element-in-the-template/35209681#35209681. `@ContentChild()` is probably what you want. – Günter Zöchbauer Mar 20 '17 at 10:23
  • In @ContentChildren(SomeType) contentChildren; But I don't want to specify a component like `app-component-one` or `app-component-two` in SomeType. Is there a way to do it? – Franz Peter Tebartz van Elst Mar 20 '17 at 11:05

0 Answers0