Getting childs inside a directive Angular

Question

I have a directive named FooDirective and injecting TemplateRef to get the template, I do have another directive named BarDirective which inject ElementRef:

Directive({
     selector: '[BarDirective]'
    })
  export class BarDirective{
    constructor(public elementRef: ElementRef<HTMLElement>) {}

Directive({
  selector: '[FooDirective]'
})
export class FooDirective{
  @ViewChild(BarDirective) pEl: BarDirective; <-- It is always undefined after AfterViewInit hook
  @ContentChild(BarDirective) pEl: BarDirective; <-- also undefined, AfterContentInit hook
  constructor(public templateRef: TemplateRef<any>) {}

I am using it like this:

@Component({template:'
<some-component>
        <div *FooDirective>
            <p BarDirective></p>
         </div>
      </some-component>
'})
export class SomeComponent{
   @ViewChild(FooDirective) foo: FooDirective <-- Ok
   @ViewChild(BarDirective) bar: BarDirective <-- undefined
}

How can I access BarDirective through FooDirectvie or SomeComponent?

I already tried ViewChild in SomeComponent which is also undefined.