禁用 Edge 的 <input> 自动填充

Question

我有一个使用预先输入功能的 Angular 4 应用程序，目前在 Edge 上的用户受到干扰。 Edge 正在填充显示在 typeahead 下拉列表顶部的自动完成下拉列表。通常，这只会令人烦恼，但以下情况除外：

用户需要选择我们称之为案例名称的内容。在这个阶段，他们很可能已经在应用程序的其他地方输入了案例名称。随后，当他们点击这个特定的预先输入时，他们可能会在 Edge 自动完成下拉菜单中看到他们正在寻找的 案例名称。如果他们使用它而不是 Input 的预先输入，则相应的 Case ID 永远不会注册到组件，并且该组件使用 ID 而不是名称执行保存。本质上，用户会看到一个有效的案例名称，点击保存，然后弹出错误消息。

此外，Input 当前使用 typeahead select 事件来响应输入更改，而不是 Angular 的双向数据绑定[(ngModel)]。

我几乎发现了确切的问题in this GitHub issue，但他们将autocomplete="off" 称为一个可行的解决方案，但是autocomplete="off" 和autocomplete="false" 似乎对input 或form 中的标签没有任何影响我的情况。

同样，post 的回复令人沮丧，表明 Edge 已禁用 autocomplete="off" 并且似乎没有提供任何替代方案。

我还发现这个response 使用一系列虚假输入的帖子，但这似乎只适用于登录凭据自动填充。

Answer 1

自动完成通常使用字段标签和 ID。您可以做的一件事（这是一个可怕的 hack）是使这些字段动态和生成（时间戳生成 GUID 或其他东西）这会破坏浏览器使用的自动完成功能，但它也会破坏您的表单的可访问性一个程度。如果这不是问题，那似乎是一个不错的解决方案。