段落内の特定の単語をハイライトする方法

Question

私はフロントエンドとしてangles 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>