在Angular中将鼠标悬停在不同组件上显示信息

Question

我有一个像图像一样的Angular应用，其中有一个侧边栏组件和一个其中包含用户的延迟加载组件。

我想要的是能够在用户卡上悬停（鼠标悬停），并且用户信息（照片，姓名和其他属性）也将显示在侧栏上（如图所示）。

有可能实现这一目标吗？

谢谢您的帮助！

Answer 1

您可以创建BehaviourSubject服务

messageSource: BehaviorSubject<string>;

并在构造函数中实例化

this.messageSource = new BehaviorSubject<string>();

您可以在组件中执行此操作

this.yourService.messageSource.next('whatvermessage');

如果您想订阅它，可以

this.yourService.messageSource.asObservable().subscribe((value: string) => {

});