angularjs - elasticsearch 上的自动完成/提前输入 angularjs Bootstrap

标签 angularjs twitter-bootstrap autocomplete elasticsearch

我一直在寻找一个可行的解决方案,以在 elasticsearch 服务器上使用 angularjs 和 bootstrap 获得自动完成/提前输入。

最佳答案

这是一个有效的解决方案,不是问题,但我想分享它希望它能有所帮助:

调用自动完成功能的html代码:

 <input required type="text"
   popover-trigger="focus"
   placeholder="recherche globale"
   class="form-control"
   ng-model="simplequeryInput"
   ng-model-onblur focus-on="focusMe"
   ng-click="searchSimple=true" ng-keyup="$event.keyCode == 13 ? submitSimple() : null"
   typeahead="item for item in autocomplete($viewValue) | limitTo:15 "
   typeahead-on-select="simplequeryInput=$model"
 />
  • 包含 elasticsearch (v2.4.0) 脚本 可用here

  • 我的 Elasticsearch 服务

    interfaceApp.service('elasticQuery', function ($rootScope,esFactory) {
      return esFactory({ host: $rootScope.elastic_host}); //'localhost:9200'
    });
    
  • angularjs 代码查询 elasticsearch :

    'use strict';
    var searchModules = angular.module('searchModules', ['ngRoute','ngDialog']);
    searchModules.controller('searchCtrl', function (ngDialog,$scope, $http,$rootScope, elasticQuery) {
      ...
      $scope.autocomplete = function(val) {
        var keywords = [];
        keywords.push(val);
        // THIS RETURN IS VERY IMPORTANT 
        return elasticQuery.search({
          index: 'YOUR_INDEX_NAME',
          size: 15,
          body: {
            "fields" : ["T_FAMILY","T_GENUS","T_SCIENTIFICNAME"], // the fields you need
            "query" : {
            "bool" : {
              "must" : [
                {
                  "query_string" : {
                    "query" : "T_FAMILY:"+val // i want only source where FAMILY == val
                  }
                }
              ]
            }
            }
          }
        }).then(function (response) {
          for (var i in response.hits.hits) {
            var fields = (response.hits.hits[i]).fields;
            var tmpObject = fields["T_FAMILY"] +" " + fields["T_GENUS"] + " ( "+fields["T_SCIENTIFICNAME"] + " )";
            keywords.push(tmpObject);
          }
        return keywords;
        });
      }
    });
    

希望对你有帮助

关于angularjs - elasticsearch 上的自动完成/提前输入 angularjs Bootstrap ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26461541/

相关文章:

css - 如何将 bootstrap form-control padding 设置为 0 px

php - 使用两个表列在 Laravel 5.5 中使用 Typeahead.js 自动完成搜索

javascript - 如何在使用 PHP 和 JS 的自动完成表单中不允许不在数据库中的值

javascript - 按 Angular ng-repeat 中的行限制文本大小

jquery - Bootstrap 词缀跳转

css - Angular UI 选项卡,在移动设备中为假

javascript - Aptana Eclipse 插件和 Dojo 自动完成

javascript - 与过滤器的一次性绑定(bind)不起作用

javascript - 我应该用什么来代替 ng-repeater

javascript - Angular : 3 different ng-repeat with the same filter, 不返回任何内容时显示消息(?)