Javascript 调整窗口大小时更改工具提示的位置

我正在使用angular创建一个投资组合，并希望使用。在浏览器（宽屏幕）中查看站点时，我希望位置正确。如果在移动设备上查看站点，我希望它显示在元素下方。 当前，当我刷新页面时，工具提示显示在正确的位置。但是，在调整浏览器大小时，更改位置时遇到问题。这一立场似乎没有改变

这是我目前掌握的密码

HTML:

TS:

tooltipPosition=window.innerWidth<600？“下'：'右'；
ngOnInit（）：void{
window.addEventListener（'resize'，this.updateTooltipPosition）；
this.updateTooltipPosition（）
}
updateTooltipPosition（）{
let position=window.innerWidth<600？'Lower'：'right'；
让tooltips=document.getElementsByClassName（'has-tooltip'）
for（设i=0；i

---

欢迎提供解决此问题的任何提示！我是一个新手，所以对我的代码的任何其他评论都很感激

媒体查询？…这似乎与typescript没有什么关系。@CharlesBamford，我删除了typescript标记，谢谢。@GetSet，问题不在于侦听调整大小事件。我可以通过控制台记录大小并查看事件是否被调用。我的问题是如何设置工具提示的位置

<fa-icon [icon]="faAddressCard" class="has-tooltip" #tooltip="matTooltip" matTooltip="About me" [matTooltipPosition]="tooltipPosition" matTooltipClass="tooltip"></fa-icon>

tooltipPosition = window.innerWidth < 600 ? 'below' : 'right';

ngOnInit(): void {
    window.addEventListener('resize', this.updateTooltipPosition);
    this.updateTooltipPosition()
}

updateTooltipPosition() {
    let position = window.innerWidth < 600 ? 'below' : 'right';
    let tooltips = document.getElementsByClassName('has-tooltip')
    for (let i = 0; i < tooltips.length; i++) {
      tooltips[i].setAttribute('ng-reflect-position', position)
    }
}