使用angularjs过滤器突出显示搜索结果

我有一个简单的表格，每一行都是通过点击“追加”按钮添加的

我需要突出显示搜索输入字段和表输入字段之间的匹配

试图使用

高亮显示

过滤器来实现此目的，但运行时出现错误：

“TypeError:无法读取未定义的属性'replace'”

我怎样才能修好它？示例代码如下：

var-app=angular.module（“myApp”，[]）；
应用过滤器（'突出显示'，功能（$sce）{
返回函数（文本、短语）{
如果（短语）text=text.replace（新的RegExp（“（“+短语+”）”，“gi”），
'$1')
返回$sce.trustAsHtml（文本）
}
});
app.controller（“myCtrl”、[“$scope”、“highlightFilter”、函数（$scope、highlightFilter）{
$scope.arr=[]；
$scope.append=函数（）{
var x={}；
x、 数据1=“”；
x、 数据2=“”；
$scope.arr.push（x）；
};
}]);

作者名单
.突出显示{背景：黄色}
追加


数据1
数据2
这里的问题是，您的过滤器将输入文本作为第一个参数，但您正在传递一个未在模型上定义的字段：
ng bind html=“x.text | highlight:search.text”
。您有字段
data1
和
data2
，但没有
text
，这就是您收到上述错误的原因

您的过滤器实际上正在工作，但您必须向其中传递一个正确的输入参数：


var-app=angular.module（“myApp”，[]）；
应用过滤器（'突出显示'，功能（$sce）{
返回函数（文本、短语）{
如果（短语）text=text.replace（新的RegExp（“（“+短语+”）”，“gi”），
'$1')
返回$sce.trustAsHtml（文本）
}
});
app.controller（“myCtrl”、[“$scope”、“highlightFilter”、函数（$scope、highlightFilter）{
$scope.arr=[]；
$scope.append=函数（）{
var x={}；
x、 数据1=“”；
x、 数据2=“”；
$scope.arr.push（x）；
};
}]);

作者名单
.突出显示{背景：黄色}
追加






数据1
数据2
谢谢！有没有可能直接在输入中突出显示？@VladyslavPlakhuta没有，因为
input
只支持纯文本。唯一的方法是用
div
和
contenteditable=“true”
模拟
input
s。你可以在这里看到一个例子