как реализовать автоматический поиск в angularjs

Question

Я пытаюсь построить автоматический поиск в angularjs.Я могу получать значения в Json obj и проходить по списку на основе поиска. Но когда я даю «backspace» или удаляю текст и пытаюсь ввести его снова, старые результаты поиска добавляются к автоматически предлагаемым.Я не понимаю, как удалить его из массива.Пожалуйста, закрепите указатель ниже для кода.

Код проблемного раздела ниже. Здесь я получаю результаты поиска, отличные от тех, которые я должен был получить

for (var i=0 ; i < $scope.suggestionResults.length ; i++){  

            //if($scope.suggestionResults[i].title.indexOf(suggestText) > -1) 
            //if($scope.suggestionResults[i].title.match(suggestText))  
                var str = $scope.suggestionResults[i].title;
            if(str.indexOf(suggestText) > 0)    
                //$scope.suggestionResults[i].title.match(suggestText)          
                {  
                    output.push($scope.suggestionResults[i].title);  
                } else{
                    console.log(suggestText + 'Not matching');
                    //array.splice(index, 1);
                    if(output.length > 0){
                        output[i].splice($scope.suggestionResults[i].title, 1);
                    }

                }
            $scope.filterSearch = output;   
            console.log($scope.filterSearch);   


        // if ($scope.suggestionResults[i].title.includes(suggestText)) {
           // output.push(suggestText);
        // }
        // $scope.filterSearch = output;

    }

Код Plnkerздесь

Answer 1

Просто объявите вывод как [] в начале, так что вы начинаете с пустого массива каждый раз, когда вы печатаете ... проверьте приведенный ниже код, чтобы удалить дублирующиеся предложения

$scope.autoComplete = function(suggestText){
        var output = [];
        if(suggestText.length === 0){
          output = [];          
        }
        if(suggestText.length > 2){
            $scope.hidethis = false;            
        }
                for (var i=0 ; i < $scope.suggestionResults.length ; i++){              
                    //if($scope.suggestionResults[i].title.indexOf(suggestText) > -1) 
                    //if($scope.suggestionResults[i].title.match(suggestText))  
                        var str = $scope.suggestionResults[i].title;
                        console.log(suggestText.toLowerCase());
                        console.log(str);
                    if(str.toLowerCase().indexOf(suggestText.toLowerCase()) > -1)   
                        //$scope.suggestionResults[i].title.match(suggestText)          
                        {  
                            output.push($scope.suggestionResults[i].title);  
                        } else{
                            console.log(suggestText + 'Not matching');
                            //array.splice(index, 1);
                            //if(output.length > 0){
                            //  output[i].splice($scope.suggestionResults[i].title, 1);
                            //}

                        }
                    $scope.filterSearch = output;   
                    console.log($scope.filterSearch);               
                  } 
}

Рабочий планер: http://plnkr.co/edit/oVRTRfC55lH5IuEIYukv?p=preview

Answer 2

Применить ' filter ' in ' ng-repeat ', как показано ниже

<ul class="list-group">
    <li class="list-group-item" ng-repeat="suggestionResult in suggestionResults | filter:{title:searchText}" ng-click="showProduct(searchText)">{{suggestionResult.title}}</li>
</ul>

Это даст следующие результаты

1. Для правильного ввода покажет предложения

Для неверного ввода не будет отображать предложения