Angular 角6中的管道荧光灯出现问题

我有一个管道，突出显示搜索的关键字

但当我清除输入表单时，我的管道会突出显示一个单词中的每个字母。如何修复它？在本例中，当文本为空时

代码类型脚本

@Pipe({
name: 'highlight'
 })

export class HighlightSearch implements PipeTransform {

public transform(value: string, predicate: string): string {

return value.replace(new RegExp(predicate, 'gi'), `<mark>${predicate}</mark>`);
   }
}

@管道({
名称：“突出显示”
})
导出类HighlightSearch实现了PipeTransform{
公共转换（值：字符串，谓词：字符串）：字符串{
replace（新的RegExp（谓词'gi'），`${predicate}`）；
}
}

HTML

{{Slide.idSlide}}
无效的

空正则表达式匹配每个字符串，因此突出显示了它。如果“关键字”为空，则添加此项作为不应用高亮显示的条件，这样您就可以了

public transform(value: string, predicate: string): string {
if(!predicate){
    return value;
}
return value.replace(new RegExp(predicate, 'gi'), `<mark>${predicate</mark>`);
   }

public转换（值：string，谓词：string）：string{
if（！谓词）{
返回值；
}
replace（新的RegExp（谓词'gi'），`${predicate`）；
}

---

或者类似的东西。

空正则表达式匹配每个字符串，因此您可以突出显示它。如果“关键字”为空，则添加此条件以不应用突出显示，这样您就可以了

public transform(value: string, predicate: string): string {
if(!predicate){
    return value;
}
return value.replace(new RegExp(predicate, 'gi'), `<mark>${predicate</mark>`);
   }

public转换（值：string，谓词：string）：string{
if（！谓词）{
返回值；
}
replace（新的RegExp（谓词'gi'），`${predicate`）；
}

或者类似的东西