Angular-CLI Elasticsearch and Webpack

Question

I'm trying to figure out how to configure my Angular(4) app with Elasticsearch 5x.

I used angular-cli to init the project, then I...

installed the types (npm install @types/elasticsearch --save) and the js client (npm install elasticsearch --save).

Now I'm trying to figure out how to connect it all... how do I tell it to load elasticsearch.angular.js? And how do I connect ES server with Angular 4?

In AngularJS (1.x), it was relatively simple...

create a service with:

    angular.module('searchapp.search-service', [])
    .constant(' BASE_URL', 'localhost:9200')
    .service('searchService', ['$q', '$sce', 'esFactory', function($q, $sce, esFactory) {
  var esClient = esFactory({
    location: 'BASE_URL',
    apiVersion: '1.5'
  });

And then you just use esClient to interact with all the ES API methods.

this.search = function(query) {
var deferred = $q.defer();

esClient.search({...

So after I've install they types and ES client, how can I connect the ES Server with Angular 4 and create a service to interact with the ES js api?

score 0 · Accepted Answer · answered Jul 10 '17 at 21:29

You've installed the library, so now you just need to import it into the respective component/service where you want to implement it.

So:

import { Client } from "elasticsearch";

and then in your code:

let elasticClient: Client = new Client({
        host: 'myhost.com',
        log: 'trace'
    });

You can see some more details about this on this issue: https://github.com/elastic/elasticsearch-js/issues/452

Angular-CLI Elasticsearch and Webpack

1 Answers1