正则表达式使搜索建议加粗，例如 Google 或 Amazon

Question

我正在寻找像 Goolge 和 Amazon 搜索建议那样使文本变粗的解决方案。

我知道如何使其相反（如果我输入 "ne"）例如。 Newton 具有如下功能：

    highlight(value, input): string {
    return value.replace(new RegExp('(^|)(' + input + ')(|$)', 'ig'), '<b></b>');
}

但是这个正则表达式应该如何实现这个 => 例如，如果我输入 "ne" 我应该得到： 1. new car 2. 超级 new 计算机 3. Newton

Answer 1

如果您在此处使用的正则表达式涵盖所有用例，一个简单的解决方案是（几乎）保持原样，然后修改 CSS 以获得所需的效果：

.search-suggestion { font-weight: bold; }
.search-suggestion > span { font-weight: normal; }

将您的搜索建议放在具有 search-suggestion class 的元素中，并修改您的正则表达式以将搜索文本包装在 <span> 而不是 <b> 中元素.

Regex to make search suggestion bold like Google or Amazon