Angular ngbPopover，如何从子组件打开弹出窗口

<button [ngbPopover]="popoverContent" popoverTitle="Popover Title">Open Popover</button>

<ng-template #popoverContent>
  <div>Popover Content</div>
  <button (click)="closePopover()">Close</button>
</ng-template>

import { Component, ViewChild } from '@angular/core';
import { NgbPopover } from '@ng-bootstrap/ng-bootstrap';

@Component({
  selector: 'app-child',
  template: `
    <button (click)="openPopover()">Open Popover</button>
  `
})
export class ChildComponent {
  @ViewChild(NgbPopover) popover: NgbPopover;

  openPopover() {
    this.popover.open();
  }
}

import { Component, ViewChild } from '@angular/core';
import { ChildComponent } from './child.component';

@Component({
  selector: 'app-parent',
  template: `
    <app-child></app-child>
  `
})
export class ParentComponent {
  @ViewChild(ChildComponent) child: ChildComponent;

  openPopoverFromChild() {
    this.child.openPopover();
  }
}