个人学习以做笔记记录,在搜索solr时对关键字进行高亮显示
/**
* 根据关键字搜索列表
* @param keywords
* @return Map
*/
private Map searchHighLightMap(String keywords) {
Map map = new HashMap<>();
HighlightQuery query = new SimpleHighlightQuery();
Criteria criteria = new Criteria("item_keywords").is(keywords);
query.addCriteria(criteria);
HighlightOptions options = new HighlightOptions();
options.addField("item_title");
options.setSimplePrefix("<font color='red'>");
options.setSimplePostfix("</font>");
query.setHighlightOptions(options);
HighlightPage<TbItem> page = solrTemplate.queryForHighlightPage(query, TbItem.class);
// 获取高亮显示内容
List<HighlightEntry<TbItem>> highlighted = page.getHighlighted();
for (HighlightEntry<TbItem> entry : highlighted) {
// 数据
TbItem entity = entry.getEntity();
// 所有高亮显示的域
List<Highlight> highlights = entry.getHighlights();
if (highlights.size() > 0 && highlights.get(0).getSnipplets().size() > 0) {
String text = highlights.get(0).getSnipplets().get(0);
entity.setTitle(text);
}
}
List<TbItem> list = page.getContent();
map.put("rows", list);
return map;
}
在服务层创建此私有方法,用于返回关键字匹配的列表结果
我们测试后发现高亮显示的html代码原样输出,这是angularJS为了防止html攻击采取的安全机制。我们如何在页面上显示html的结果呢?我们会用到$sce服务的trustAsHtml方法来实现转换。
因为这个功能具有一定通用性,我们可以通过angularJS的过滤器来简化开发,这样只写一次,调用的时候就非常方便了
// 定义模块:
var app = angular.module("pinyougou",[]);
/*$sce服务写成过滤器*/
app.filter('trustHtml',['$sce',function($sce){
return function(data){
return $sce.trustAsHtml(data);
}
}]);
ng-bind-html指令用于显示html内容
竖线|用于调用过滤器
OK完成