Angular中：点击事件触发时阻止BLUR事件的实现方案问询

我正在开发一个Angular应用，碰到了个棘手的场景：当点击某个元素（比如按钮）的时候，我需要阻止原本绑定在输入框上的blur事件执行。

但我现在搞不懂怎么实现——毕竟点击外部元素时，原输入框肯定会失去焦点，blur事件总是会先一步触发完成，就像我点击Clear按钮时的情况：先触发了输入框的BLUR事件，之后才会执行按钮的点击逻辑。

下面是这个问题的直观演示：

我还专门做了一个StackBlitz示例来复现这个问题，方便大家帮忙排查。

有没有大佬能给我支个招，怎么才能在点击事件触发时，把blur事件给拦住呢？

备注：内容来源于stack exchange，提问作者avishekdr