我在以下情况下遇到ngstrap typeahead问题:

var companyItem= [
 {
"item_id": 1,
"item_name": "mobile phone middle nokia",
"company_id": 1,

},
{
"item_id": 2,
"item_name": "mobile phone iphone",
"company_id": 1,

},
{
"item_id": 8,
"item_name": "mobile phone samsung",
"company_id": 1,

},
{
"item_id": 9,
"item_name": "apple watch",
"company_id": 1,

}
]


我的标记:

<input type="text" class="form-control" name="itemName" id="itemName" ng-model="item.itemName" data-min-length="0" bs-options="item as item.item_name for item in companyItem | filter:{item_name:$viewValue}:customCompare" bs-typeahead="setCustomerData" data-watch-options="true" data-container="body" autocomplete="off" ng-readonly="readOnly" required>


我的脚本是:

$scope.customCompare = function(itemName, viewValue) {
    var keyword = viewValue.split(" ");
    var partialMatch = false;

    for(var i=0;i<keyword.length;i++){
          console.log('keyword'+i+' '+keyword[i]);
            console.log('itemName '+itemName);
            console.log('keyword[i].indexOf(itemName) > -1 '+itemName.indexOf(keyword[i].toString()));
            if(itemName.indexOf(keyword[i].toString()) > -1){
               console.log(' <<>>---------------');
                partialMatch =true;

            }

    }
       return partialMatch;
}


我尝试在输入文本中搜索关键字“ mobile iphone”,但没有结果。

当我在控制台日志中写入时返回true,但记录未显示

无论如何,如果“ phone iphone”可以像默认输入一样工作

我做错了什么或这种方法不起作用

https://plnkr.co/edit/3iJwREetLMnTup24Sbtd

提前致谢。

最佳答案

Ng-strap adds a default filter that uses a default comparator之后的here

一种骇人听闻的解决方案是绕过默认过滤器。



$scope.alwaysTrue = function() { return true; }

<input ... bs-options="item as item.item_name for item in companyItem | filter:{item_name:$viewValue}:customCompare" data-comparator="alwaysTrue" ...>





较干净的解决方案是设置item as item.item_name for item in companyItem | filter:{item_name:$viewValue}:customCompare。可悲的是,这不起作用,因为包含data-comparator="customCompare",而不是:$viewValue。因此,:{item_name: $viewValue}永远无法处理整个对象。

该API可以而且应该加以改进,您应该在github上打开一个有关它的问题。

10-04 21:49