material autocomplete 可以只建议一个词,而不是整个输入值吗?

Can material autocomplete suggest only one word, not the whole input value?

有什么方法可以让 angular material 自动完成只建议一个术语,而不是整个输入值?默认的自动完成组件可以向用户显示可能的变体是什么,如果用户选择了一个变体,那么它将被设置为输入的值。我想要的是让用户输入任意数量的单词并为每个单词建议变体。例如,如果我将 ['dog', 'cat', 'bandicoot'] 作为自动完成变体传递,并且用户输入 I love my c 然后他会看到 catbandicoot 作为建议。与任何 IDE 自动完成一样:它不会从头到尾建议整个句子,它只会建议您将要输入的下一个词

请让我知道其他 components/libraries/scripts 中是否有这样的功能,而不仅仅是 angular material 库

提前致谢

这是一件很复杂的事情。大多数 IDE 使用 LSP(参见 here)或类似的东西来解决可能的建议。他们之所以能够做到这一点,是因为他们特别了解所使用的语言,因此他们知道如何计算单词边界,并且可以根据单词的上下文预测用户可能想要插入的内容。

在“真实”语言中,单词边界的计算方式因使用的语言环境而异。例如。泰语不使用空格作为单词边界(实际上需要非常具体的词典才能正确计算更复杂的情况)。此外,有时连字符(例如“test-case”)可以被视为单个词或多个词。

因此,您需要:

  1. 解析输入并根据一些规则(例如 Unicode,应在即将推出的 ECMA 脚本版本中实现,请参阅提案 here。IIRC 目前在 Chromium-based 中实现浏览器,但 API 仍然可以更改)。
  2. 检查当前插入符位置(用户可以在文本中间插入输入)
  3. 获取插入符号位置下的“单词”,并运行 与可能单词的“数据库”进行匹配。同样,匹配规则由您根据您的要求决定。一些正则表达式检查将是一个很好的初始候选者。
  4. 创建一个包含可能插入项目列表的叠加层(菜单)(例如,您可以使用 cdk-overlay,因为您似乎已经在使用 material)。
  5. 从列表中选择一项后,将插入符号下的“单词”替换为您需要的单词并关闭覆盖。

我不知道有任何库可以处理这种用例,因为它需要很多非常具体的逻辑。如果您希望它正常工作并符合您的规格,最好的办法是从头开始编写一些东西。我不能分享我开发的解决方案,因为它是我工作的公司的专有代码。但上述步骤应该可以让您开始一些可以扩展的基本解决方案。

用 Google 搜索了很多,发现了一些漂亮的术语建议示例:suggestor.js and suggest.js。事实证明,如果你想找到这样的东西,你最好 google "js term suggestion" 而不是 "js autocomplete by one word".很明显,但我还是花了一些时间才找到它。谢谢大家

原始问题仍然悬而未决 - 是否可以使用 angular material 组件

实现术语建议