Question

在我的Input with a clear button上添加清除按钮（第autocomplete component节）会导致奇怪的行为：按Enter清除输入是否为所选选项。

为了说明我的问题，我从原始角度材料文档中修改了关于自动完成的stackblitz-添加了清除按钮行为。参见this

我无法弄清楚为什么在输入简单的情况下此清除按钮会正常工作，但是在自动完成组件的情况下会中断所有操作，为什么将焦点放在输入而不是输入上并调用“单击”处理程序。

任何提示将不胜感激。预先感谢！

Answer 1

由于MatFormField位于form内部，因此默认情况下，清除按钮的类型为submit，它变为the default button。因此，当您在表单的输入元素中按 Enter 时，单击按钮并提交表单。为避免这种情况，请在清除按钮上设置属性type="button"：

<button type="button" mat-button ...>

有关演示，请参见this stackblitz。