Algolia angular autocomplete не работает

Я пытаюсь получить Angolia autcomplete директиву для угловой работы, но с проблемами. Я попытался следовать примеру из docs. Я столкнулся с несколькими проблемами.Algolia angular autocomplete не работает

В частности, в getDatasets я в настоящее время получает ошибку b.$watchCollection is not a function

Я сделал plunkr. У кого-нибудь есть рабочий пример, использующий угловую директиву algolia?

$scope.q = ''; 
    var client = algolia.Client('latency', '6be0576ff61c053d5f9a3225e2a90f76'); 
    var index = client.initIndex('contacts'); 
    $scope.getDatasets = function() { 
    return { 
     source: function(q, cb) { 
     index.search(q, { hitsPerPage: 5 }, function(error, content) { 
      if (error) { 
      cb([]); 
      return; 
      } 
      cb(content.hits); 
     }); 
     }, 
     templates: { 
     suggestion: function(suggestion) { 
      return suggestion._highlightResult.name.value; 
     } 
     } 
    }; 
    }; 
    $scope.$watch('q', function(v) { 
    console.log(v); 
    }); 
    $scope.$on('autocomplete:selected', function(event, suggestion, dataset) { 
    console.log(suggestion, dataset); 
    });

источник

2016-03-14 user2954587

Я попробовал ваш plunkr, и кажется, что ваша версия Угловой староват, я обновил его с одним из примера и it works.

// the main (app) module 
 
angular 
 
\t .module("myApp", ['algoliasearch', 'algolia.autocomplete']) 
 
\t .controller("myCtrl", function($scope, algolia) { 
 
    $scope.q = ''; 
 
     var client = algolia.Client('latency', '6be0576ff61c053d5f9a3225e2a90f76'); 
 
     var index = client.initIndex('contacts'); 
 
     $scope.getDatasets = function() { 
 
     console.log('getting datasets') 
 
     return { 
 
      source: function(q, cb) { 
 
      index.search(q, { hitsPerPage: 5 }, function(error, content) { 
 
       if (error) { 
 
       cb([]); 
 
       return; 
 
       } 
 
       cb(content.hits); 
 
      }); 
 
      }, 
 
      templates: { 
 
      suggestion: function(suggestion) { 
 
       return suggestion._highlightResult.name.value; 
 
      } 
 
      } 
 
     }; 
 
     }; 
 
     $scope.$watch('q', function(v) { 
 
     console.log(v); 
 
     }); 
 
     $scope.$on('autocomplete:selected', function(event, suggestion, dataset) { 
 
     console.log(suggestion, dataset); 
 
     }); 
 
});

.algolia-autocomplete { 
 
     width: 100%; 
 
     } 
 
     .algolia-autocomplete .aa-input, .algolia-autocomplete .aa-hint { 
 
     width: 100%; 
 
     } 
 
     .algolia-autocomplete .aa-hint { 
 
     color: #999; 
 
     } 
 
     .algolia-autocomplete .aa-dropdown-menu { 
 
     width: 100%; 
 
     background-color: #fff; 
 
     border: 1px solid #999; 
 
     border-top: none; 
 
     } 
 
     .algolia-autocomplete .aa-dropdown-menu .aa-suggestion { 
 
     cursor: pointer; 
 
     padding: 5px 4px; 
 
     } 
 
     .algolia-autocomplete .aa-dropdown-menu .aa-suggestion.aa-cursor { 
 
     background-color: #B2D7FF; 
 
     } 
 
     .algolia-autocomplete .aa-dropdown-menu .aa-suggestion em { 
 
     font-weight: bold; 
 
     font-style: normal; 
 
     }

<script src="//cdn.jsdelivr.net/jquery/2.1.4/jquery.min.js"></script> 
 
<script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.2/angular.min.js"></script> 
 
<script src="//cdn.jsdelivr.net/algoliasearch/3/algoliasearch.angular.min.js"></script> 
 
<script src="//cdn.jsdelivr.net/autocomplete.js/0/autocomplete.angular.min.js"></script> 
 

 

 

 
<body ng-app="myApp" ng-controller="myCtrl"> 
 
    <div class="container"> 
 
     <form action="#"> 
 
     <div class="autocomplete-wrapper"> 
 
      <input id="contacts" name="contacts" type="text" ng-model="q" autocomplete aa-datasets="getDatasets()" /> 
 
     </div> 
 
     </form> 
 
    </div> 
 
</body>

источник

2016-03-14 08:33:58 Shipow

FYI мульти-категория автополный [пример] (https://www.algolia.com/doc/search/auto-complete#ui-1) Из документов, как представляется, за работой – user2954587

Algolia angular autocomplete не работает

ответ

Смежные вопросы