如何突出显示段落中的特定单词

Question

我使用角度js MVC作为我的前端和html，bootstrap。我试图按照搜索关键字（ng-model）显示结果。 我的要求是以这种方式，在显示的结果中，我需要在结果中突出显示搜索关键字。

我的内容显示在<p>标记内。

Answer 1

HTML

 $scope.highlight = function(haystack, needle) {
        if(!needle) {
            return $sce.trustAsHtml(haystack);
        }
        return $sce.trustAsHtml(haystack.replace(new RegExp(needle, "gi"), function(match) {
            return '<span class="highlightedText">' + match + '</span>';
        }));
    };

CSS

.highlightedText {
    background: red;
}

HTML

<div ng-bind-html="highlight('Nic is cool and smart', 'and')"></div>