ngstrap машинописного неупорядоченный поиска несколько ключевых слов

Question

Я возник проблемы с ngstrap машинописного с ниже сценарием:

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, 

} 
] 

Мой Markup:

<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; 
} 

Я пытаюсь выполнить поиск по ключевому слову «мобильный iphone» во входном тексте, но результата нет.

Это возвращение верны, как я пишу в журнале консоли, но запись не показывая

В любом случае, если «телефон iphone», это работает, как по умолчанию машинописного

Все, что я сделал неправильно, или этот подход не работает

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

заранее спасибо.

Answer 1

Ng-strap adds a default filter that uses a default comparator после вашего item as item.item_name for item in companyItem | filter:{item_name:$viewValue}:customCompare.

Одним из хакерских решений является обход фильтра по умолчанию.

$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" ...>

Очиститель решением было бы установить data-comparator="customCompare". К сожалению, это не работает, потому что here содержит :$viewValue, а не :{item_name: $viewValue}. Таким образом, customCompare никогда не получает обработку всего объекта.

API может и должен быть улучшен, и вы должны открыть проблему об этом на github.

Answer 2

я получил еще одно решение, как я увидел «фильтр:" bsAsyncFilter»в typeahead.js так я переопределять в моих JS перепускного фильтра, потому что теперь я использую данные асинхронных через API:

function CustomTypeaheadFilter ($filter) { 
return function(array, expression, comparator) { 

    if(array && angular.isFunction(array.then)) { 
    return array.then(function(results) { 
     console.log(results); 
    // return $filter('filter')(results, expression, comparator) 
    return results; 
    }); 
    } else { 
    //return $filter('filter')(array, expression, comparator); 
    return array; 
    } 
} 
}; 

Разметьте:

<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 getItemfromDB($viewValue)" bs-typeahead="setCustomerData" data-filter="CustomTypeaheadFilter" autocomplete="off" required> 

вариант фильтра не объявить в ngstrap документе, я разместил вопрос на GitHub все равно надеюсь, что ngstrap поднимет этот вариант в документе то.