如何从 angular 的关键事件中获取 clientX 和 clientY？

Question

我正在使用 keydown 事件，但无法让 clientX 和 clientY 使用它们来显示菜单。 我在@键上收听，然后在一个小菜单中显示用户列表，但我也无法获得 clientX，也无法获得 clientY 或/和 pageY 和 pageX。

Answer 1

您应该获取父元素的 position，以便您知道放置子元素的位置。

这是一个例子

    const input: HTMLInputElement = event.target as any;
    const value = input.value;

    if (!value.endsWith('@')) return;

    const { x, y, width, height } = input.getBoundingClientRect();

    console.log(`Menu under input should be at [${x}, ${y + height}]`);