繁体   English   中英

使用autocomplete.js并从多个Algolia来源读取的Angularjs应用无法正常工作

[英]Angularjs app using autocomplete.js and reading from multiple Algolia sources not working

我正在尝试使用AngularJS和Algolia的Autocomplete.js以及来自Algolia的两个来源(索引)来实现自动完成功能。

第二个源自动完成功能正常,但是地址自动完成功能仅适用于键入的第一个字母/数字。 当您键入第二个字符时,地址列表消失。 如果我交换两个来源,则地址工作正常,而邮政编码仅适用于第一个字母/数字。

另外,在进行搜索时, console.log(address); 显示要搜索的正确地址,只是不显示在自动完成结果中。

这是它的实际效果: http : //d.pr/i/2GCE

$scope.getDatasets = function() {
return [{
  source: algolia.sources.hits(settings.replica, { hitsPerPage: 5 }),
  displayKey: 'address',
  name: 'address',
  templates: {
    suggestion: function(suggestion) {

       var address = '<span class="address">' + suggestion._highlightResult.address.value;

       if(suggestion.aptmnt) {
        address += ', Unit ' +suggestion.aptmnt + '</span> | ';
       } else {
        address +='</span> | '; 
       }

       address += '<span>' + suggestion.totbdrms + ' beds </span> | ' +
        '<span>' + suggestion.totbaths + ' bath asdf </span> | ' +
        ' <span> $' + cleanPrice(suggestion.price) + '</span>';
        console.log(address);
        return address;
    }
  }
},{
  source: algolia.sources.hits(settings.zipcode, { hitsPerPage: 5 }),
  displayKey: 'zipcode',
  name: 'zipcode',
  templates: {
    suggestion: function(suggestion) {
       var zipcode = '<span class="zipcode">' + suggestion.zipcode + '</span>';
        return zipcode;
    }
  }
}]
};

我正在使用

jquery - v1.12.4
angularjs - 1.6.1
algoliasearch.angular.min.js - v3
algoliasearch.helper.min.js - v2.18.0
autocomplete.angular.min.js - v0.28.1
angular-ui-router.js - v0.4.2

好的,我找到了解决方法。 我永远无法获得自动完成功能的Angular版本。 另外,当我console.log(o); autocomplete.angular.js中的构造函数function Dataset(o) {} ,它两次注销。 不知道这是否是问题...但是正常的autocomplete.js不会两次注销。

自从切换到autocomplete.j以来,autocomplete一直表现出色。 这是我正在使用的代码:

autocomplete('#quicksearch', { hint: false, debug: true, openOnFocus: true }, [
{
  source: autocomplete.sources.hits(settings.replica, { hitsPerPage: 5 }),
  displayKey: 'address',
  name: 'address',
  templates: {
    suggestion: function(suggestion) {

       var address = '<span class="address">' + suggestion._highlightResult.address.value;

       if(suggestion.aptmnt) {
        address += ', Unit ' +suggestion.aptmnt + '</span> | ';
       } else {
        address +='</span> | '; 
       }

       address += '<span>' + suggestion.totbdrms + ' beds </span> | ' +
        '<span>' + suggestion.totbaths + ' bath </span> | ' +
        ' <span> $' + suggestion.price + '</span>';
        return address;
    }
  }
},{
  source: autocomplete.sources.hits(settings.zipcode, { hitsPerPage: 5 }),
  displayKey: 'zipcode',
  name: 'zipcode',
  templates: {
    suggestion: function(suggestion) {
       var zipcode = '<span class="zipcode">' + suggestion.zipcode + '</span>';
        return zipcode;
    }
  }
}

]);

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM