AngularJS:按搜索文本的相似性排序搜索结果

Question

在过去的一年左右的时间里,我已经构建了无数角度驱动的,类似于你的搜索式搜索,我喜欢它们实现起来的容易程度.但是,我从来没有找到一个好的解决方案的一个问题是如何正确地对这些搜索结果进行排序.我真的很感激任何有关如何做到这一点的想法的人.

这是我的问题:

请参阅此Plunker以供参考

如果你看一下上面这个超级简单的示例plunker,我有一个我希望能够搜索的样本宠物列表.如果我在字段中输入任何文本,宠物列表就会缩小.这一切都很棒.我的问题是,搜索结果的排序与它们与输入文本的相似程度无关.

例如:

列表中共有8只宠物,name使用orderBy:'name'列表ng-repeat指令中的过滤器进行排序.如果我只T输入输入的字符,我只剩下5个剩余的结果.但是列表顶部的宠物是"blackie"(因为blackie是列表中的第一个宠物t,因为blackie type是"cat",其中包含a t).

我希望看到的是通过它们与搜索文本的相似性来对剩余结果进行排序的方法.所以,在上面的例子中,我没有看到列表顶部的"blackie",而是看到"tom"(位于已过滤列表的底部),因为tom的名字实际上是以字母开头的t,这就是我的意思开始寻找并且更有可能成为我想要找到的东西.

关于如何实现这种搜索算法的任何想法？我无法在谷歌搜索中找到任何东西以及我编写这种算法的所有尝试.

提前感谢您的想法!

Answer 1

定义您自己的过滤器以缩小列表范围,并为每个项目计算排名并将计算的排名分配给该项目.然后按排名排序.

像这样更改HTML:

<pre ng-repeat="pet in pets | ranked:inputText | orderBy:'rank':true">{{pet | json}}</pre>

添加以下过滤器:

app.filter('ranked', function() {
return function(obj, searchKey)
{
  if (!obj)
    return obj;
  for(var i =0; i< obj.length; i++)
  {
     var currentObj = obj[i];
      var numOfName = currentObj.name.indexOf(searchKey) + 1;
      var numOfType = currentObj.type.indexOf(searchKey) + 1;
      var numOfColor = currentObj.color.indexOf(searchKey) + 1;

      currentObj.rank = numOfName * 10 + numOfType * 5 + numOfColor;
  }
  return obj;
}
});