我正在创建一个网站,其中我的对象都具有'tags'属性,这是一个字符串列表。
我正在创建一个过滤列表中所有元素的搜索功能。如果用户输入'#something here',那么我只想将用户输入与每个属性的标签相匹配。如果用户只是在搜索框中输入一个字符串,那么我想搜索所有对象属性。
我有一个如此定义的表单:
<form class="navbar-form navbar-left" role="search">
<div class="form-group">
<input data-ng-model="$root.searchText" type="text" class="form-control" placeholder="#hashtag or just a string">
</div>
</form>
我知道如果我用我想要的字段定义data-ng-model,可以按照我想要的方式使用默认过滤器。因此,如果我只想搜索标签,我会做data-ng-model ='$ root.searchText.tags',用户输入只会匹配。如果我想搜索所有,那么我会做data-ng-model ='$ root.searchText。$'。
但是如何根据用户是否在开头键入带有'#'的字符串来进行模型切换?
我尝试过创建自定义过滤器,但这让人感到困惑。应该有某种条件语句将模型设置为$ root.searchText.tags或$ root.searchText。$,但这比我想象的要困难。有谁知道如何构建该条件语句?
答案 0 :(得分:1)
我有一个解决方案,虽然它可能不是最好的解决方法。 您可以根据逻辑查看搜索过滤器并更新列表:
1.如果searchText以'#'开头,则按标签过滤
2.fitler属性值,如果searchText 不以'#'开头
$scope.$watch('model.search', function(search){
var tagFilter,results;
if(search.startsWith('#')) { //handle tag filter logic
tagFilters = search.split('#');
console.log(tagFilters);
results = _.filter($scope.model.lists, function(obj){
return _.intersection(obj.tags, tagFilters).length > 0;
});
} else { //handle property filter logic
results = _.filter($scope.model.lists, function (obj) {
return _.values(obj).some(function (el) {
return el.indexOf(search) > -1;
});
});
}
console.log(results);
$scope.model.displayItems = results;
}, true);