Currently engaged in a project that involves creating a mobile application design within a web application.
I'm wondering how to display my Component object on a page using ViewChild?
I have a list of PageComponents, below is the PageComponent class:
export class PageComponent implements OnInit {
pageName : string;
components: Array<BaseComponentComponent>[]
constructor() {
}
public setPageName(name: string) {
this.pageName = name;
}
public getPageName() {
return this.pageName;
}
}
HTML content of PageComponent:
<p>
{{pageName}}
</p>
Nothing out of the ordinary so far, but I want to open the clicked PageComponent from the list.
I attempted to use ComponentFactoryResolver for this purpose, however, it creates a new instance of PageComponent which wasn't helpful.
openPage(page: PageComponent) {
let test = this.cfr.resolveComponentFactory(page);
this.parent.clear();
let componentRef = this.parent.createComponent(test);
}
Is there a way to display the Component object directly onto a page?