Why does @ContentChildren include self (this) when requesting an appropriate selector?

Question

I have a component that can be nested and it is trying to request its children.

@Component({ selector: "container", template: `[{{this.children.length}}]<ng-content></ng-content>` }) export class ContainerComponent { @ContentChildren(ContainerComponent) public children:QueryList<ContainerComponent>; } 

However, QueryList not only includes all child components, but also the query component itself (== this).

 <container> <container></container> <container></container> </container> 

Output: [3] [1] [1], not [2] [0] [0].

https://plnkr.co/edit/mGuJEE60QUCXYb3jIYUx?p=preview

Can this be prevented? There is @SkipSelf for DI, but it does not apply to @ContentChildren.

Answer 1

There is an open error to get this change, and it has been confirmed. This will change in the future.

https://github.com/angular/angular/issues/10098#issuecomment-235157642