Angular2 Reusing Components

Question

I have common components in my app like header, dialogBox, etc that I use in other components. They way I do it right now is I simply use them as HTML tags whenever I need. For example if my header component's selector is 'app-header' , everytime I want to include header I use <app-header></app-header> .

I feel like this is not the right way of doing it, because Angular has thing called ViewChild which supposedly do the same thing. However, when I try to use ViewChild I get the same error as discussed here: https://github.com/angular/angular/issues/5415

Answer 1

Looks, like your problem is completely different from the problem from issue 5415 (your link)..

If you want to have always some components on your page and just some replacement - you need to use a Router.

https://angular.io/docs/ts/latest/guide/router.html

Answer 2

I think you just need to add the child component selectors in the template for the parent component. Once done this way, the child components will appear whenever you use the parent component. I have been doing this in my angular 2 projects and this works. Let me know if my understanding about your problem is correct. Cheers, Abhi