如何从 AngularJS 应用程序中使用的 Angular 组件传递数据？

问：

用例： 我在 AngularJS 应用程序中使用了一个 Angular 组件。该组件应该在单击按钮时发出一个事件，该事件将由父页面 AngularJS 应用程序捕获。

然后父页面（在 AngularJS 中）将触发重新加载。

我一直在从 Angular 组件发出一个事件，理想情况下应该在 AngularJS 应用程序中捕获该事件。我尝试使用发出事件来实现这一点。EventEmitter

在 Angular 组件中

export class customComponent {
  @Output() customEvent = new EventEmitter<string>();

  emitEvent() {
    this.customEvent.emit('someText');
  }
}

<button (click)="emitEvent()">
Emit Event
</button>

在 AngularJS 父页面控制器中

$rootScope.$on('customEvent', (event, data) => {
      console.log(event, data);
    });

<custom-component></custom-component>

我还尝试使用$scope捕获事件，但也没有成功。

这里缺少什么吗？