javascript - 如何使用ngTagsInput过滤数据

标签 javascript html angularjs ng-tags-input

我有可以扩展搜索范围的代码,但我需要缩小搜索范围的帮助。一个例子是添加标签(颜色、绿色),并且仅显示“颜色绿色”,而不显示所有颜色和 ARM 。

这是我的示例:http://codepen.io/stvgale/pen/vxzBXO

app.filter('filterByTags', function () {
return function (items, tags) {
if (!tags || !tags.length) {
  return items;
}

var lowerTags = angular.copy(tags);
angular.forEach(lowerTags, function (tag) {
  tag.text = angular.lowercase(tag.text); 
});

var filtered = [];
(items || []).forEach(function (item) {
  var matches = lowerTags.some(function (tag) {
    return (angular.lowercase(item.data1).indexOf(tag.text) > -1) ||
           (angular.lowercase(item.data2).indexOf(tag.text) > -1);
  });
  if (matches) {
    filtered.push(item);
  }

});

return filtered;
};});

最佳答案

您可以使用正则表达式

加入标签数组以获取搜索文本

var searchtext = lowerTags.map(function(elem){
        return elem.text;
    }).join(" ");

例如,如果您的标签是颜色,绿色

var searchtext 将为绿色

然后您可以使用此文本作为正则表达式模式来检查哪些项目匹配

var patt = new RegExp(searchtext,'i');

并返回匹配的项

var filtered = [];
    (items || []).forEach(function (item) {
      var matches = lowerTags.some(function (tag) {
        return patt.test(item.data2);
      });
      if (matches) {
        filtered.push(item);
      }

    });

    return filtered;

这是FULL Example

关于javascript - 如何使用ngTagsInput过滤数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43038118/

相关文章:

html - 音频标签自动播放不适用于移动设备

php - 我想从数据库中选择一个表并显示在下拉列表中

javascript - 如何用另一个 Angular 图像更新一个div?

javascript - 我可以确定每个事件处理程序都将完成执行吗?

javascript - 动态添加多个框阴影的纯CSS方案

javascript - 尽管在 html 中提供了正确的路径,但仍未正确找到图像源

angularjs - 第一次运行 Angular 4 Web 应用程序项目后显示空白屏幕

javascript - 在 angularjs 中找不到 url

javascript - 在一页上渲染多个 CanvasJS 图表时出现问题

javascript - vue-strap `select` 组件