I am facing a challenge in Angular where I need to retrieve all the ChildComponents from my ParentComponent. The issue is that the ChildComponents are not directly nested within the ParentComponent, but instead they are children of other components which are then children of the parent component.
Consider the following template:
<parent>
<child>Child 1</child>
<another_component>
<child>Child 2</child>
</another_component>
</parent>
This is how my Parent Component looks like:
export class ParentComponent implements OnInit, AfterViewInit {
@ContentChildren(ChildComponent) entries: QueryList<ChildComponent>;
constructor() {
}
ngOnInit() {
}
ngAfterViewInit() {
this.entries.toArray().forEach(component => {
// Only Child 1 is accessible here
});
}
In conclusion, although only Child 1 is present in the QueryList, I also require access to Child 2.